Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Henrik Vincent 122 posts 616 karma points
    Nov 20, 2018 @ 12:59
    Henrik Vincent
    0

    Simple comment function property editor

    Edit: Added final code after solution for anyone interested

    Hi guys.

    I'm trying to create a simple comment property editor, to use in backoffice.

    The idea with it, is that I want to use this property editor, to add comments in the backoffice using a string, from the editors settings, like the image below.

    enter image description here

    HTML

    <h1>Comment</h1>
    <div ng-controller="commentscontroller">
      <div ng-show="model.comment" class="wmd-panel wmd-preview">$scope.model.comment</div>
    </div>
    

    Controller

    angular.module("umbraco").controller("commentscontroller",
        function ($scope) {
            $scope.model.value = $scope.model.config.comment;
        });
    

    package.manifest

    {
        propertyEditors: [
            {
                /*this must be a unique alias*/
                alias: "Comments",
                /*the name*/
                name: "Comments",
                /*the icon*/
                icon: "icon-conversation-alt",
                /*grouping for "Select editor" dialog*/
                group: "Rich Content",
                /*the HTML file we will load for the editor*/
                editor: {
                    view: "~/App_Plugins/Comments/comments.html"
                },
                prevalues: {
                    fields: [
                        {
                            label: "Kommentar",
                            description: "Indtast kommentaren",
                            key: "comment",
                            view: "textarea"
                        }
                    ]
            }
            }
        ],
        javascript:
        [
            "~/App_Plugins/Comments/comments.controller.js"
        ]
    }
    

    I cant seem to get the typed in value from the editors settings, into the page enter image description here

    Hope you guys can help me ouy.

    Best

    Henrik

  • Marc Goodson 2155 posts 14406 karma points MVP 9x c-trib
    Nov 20, 2018 @ 20:55
    Marc Goodson
    101

    Hi Henrik

    Have you seen the uEditorNotes package? https://our.umbraco.com/packages/backoffice-extensions/ueditornotes/

    it looks like it is similar to what you are trying to do, so you could see from the github repository: https://github.com/marcemarc/EditorNotes/tree/master/tooorangey.EditorNotes

    how this works!

    From what you post above, it looks like you have a value determining whether to show the comment or not

    ng-show="model.comment"

    so try setting model.comment to true in the controller to ensure this appears...

    and then I think you are reading correctly the config item via the controller:

    $scope.model.value = $scope.model.config.comment;

    but you seem to be writing out a different property in the view

    $scope.model.comment instead of either $scope.mode.value or $scope.model.config.comment

    but hopefully the existing uEditorNote package will give you something to compare with.

    regards

    marc

  • Henrik Vincent 122 posts 616 karma points
    Nov 21, 2018 @ 08:28
    Henrik Vincent
    0

    Hi Marc

    Thanks alot for your help!

    I took a look at the uEditorNotes, and ended up with the following:

    HTML

    <div ng-controller="commentscontroller" class="umb-editor umb-rte tooorangey-editornote">
        <div class="panel-body">
            <div ng-bind-html-unsafe="comment"></div>
        </div>
    </div>
    

    Controller

    angular.module("umbraco").controller("commentscontroller",function ($scope) {
        if (typeof $scope.model.config.comment != "undefined") {
               $scope.comment = $scope.model.config.comment;
           }
    });
    

    I'm able to use HTML in the textbox, so kept it at that, instead of adding an RTE.

    Might go forward with that later :)

    Once again, thanks a bunch for your quick and great advice :)

    Best

    Henrik

Please Sign in or register to post replies

Write your reply to:

Draft