creating custom property editor

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

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

TheOriginal 22 posts 122 karma points

Mar 17, 2016 @ 11:36
0

Creating custom property editor
I am trying to create a custom property editor in umbraco, I have created the manifest, html and js file, for now i just want the editor to appear and display a value in umbraco so i know it's working. Umbraco doesn't seem to be able to find out. I've rebuilt the umbraco and reloaded it twice but it still isn't showing up can someone help, here's my code:

Manifest:
```
{
propertyEditors: [      
    {
        id: "B2FE9CFE-50FC-42A5-9DFE-66DE84653667",
        name: "uFace",
        editor: {
            view: "~/App_Plugins/uFace/uFace.html"
        }
    }
]
,
javascript: [
    '~/App_Plugins/uFace/uFace.controller.js'
]
}
```
HTML:
```
<div ng-controller="uFaceController">
      <textarea>Test</textarea>
</div>
```
Javascript:
```
angular.module("umbraco").controller("uFaceController", function () {
     alert("Editor success!")
});
```
Any help will be greatly appreciated!
Copy Link
Sebastiaan Janssen 5060 posts 15522 karma points MVP admin hq

Mar 17, 2016 @ 18:36

1

I think it's because property editors need an alias, instead of an Id: https://our.umbraco.org/documentation/Tutorials/Creating-a-Property-Editor/

Copy Link
Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib

Mar 17, 2016 @ 18:59

0

Yep, you indeed need an alias instead of an id.

Also be aware that it's a good idea to se the debug mode in the web.config to true to avoid the backoffice assets (including your property editor) to be cached so hard that the changes you make are not visible before you clear the cache the hard way.

Sometimes you'll also need to empty the browser cache in order for changes to take effect.

Another good resource for learning more about property editors in Umbraco is the Angularjs Workbook found here https://github.com/umbraco/AngularWorkbook - However it seems that the same concepts are covered in the new documentation that sebastiaan referenced above - But in the workbook you can learn some other nifty things like how to use a property editor as a macro parameter should the need arise - But be aware that the workbook is two years old so some things might be slightly outdated.

Hope this helps.

/Jan

Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?