Copied to clipboard

Flag this post as spam?

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

  • David Knittl 9 posts 109 karma points
    Mar 25, 2019 @ 15:40
    David Knittl

    Custom Property Editor with valueType JSON

    Hi there,

    I'm trying to implement a custom property editor in Umbraco 8. I know that the video on is outdated, but I still followed the instructions in

    and created my package manifest where I declared the valueType as JSON:

        propertyEditors: [
                alias: "MyEditor",
                name: "myEditor",
                editor: {
                    view: "~/App_Plugins/MyEditor/myEditor.editor.html",
                    valueType: "JSON"

    In the view I try to bind two inputs to their corresponding properties (ng-model="model.value.val1" and ng-model="model.value.val2"):

    <input name="numberField1" class="umb-property-editor umb-number" type="number" ng-model="model.value.val1" />
    <input name="numberField2" class="umb-property-editor umb-number" type="number" ng-model="model.value.val2" />

    When I try to use this data type in the Umbraco backoffice, I get a Javascript error:

    Cannot create property 'val1' on string ''

    Does anyone know what changed in Umbraco v8 compared to v7 regarding custom property editors? Since the documentation is also not yet updated, I have no idea what's wrong here.

    Thanks in advance for any help you can provide!

    Cheers, David

  • David Knittl 9 posts 109 karma points
    Apr 03, 2019 @ 14:20
    David Knittl

    Nobody has any idea why this is?

  • Dennis Flæng Jørgensen 35 posts 139 karma points c-trib
    Apr 03, 2019 @ 16:06
    Dennis Flæng Jørgensen

    According to this post JSON is saved as ntext in the database. It might be because a string is the default value for that datatype. Im not sure if its an new issue in v8.

    What you can do as a fix is putting this in the controller for your property editor:

        var initModelValue = $scope.$watch('model.value', function (model) {
            if (typeof model === 'string' && model.length == 0)
                $scope.model.value = {};
            initModelValue(); //Deregisters the watch so we wont waste resources
  • David Knittl 9 posts 109 karma points
    Apr 12, 2019 @ 13:35
    David Knittl

    Cool, thanks! That works flawlessly!

Please Sign in or register to post replies

Write your reply to: