Create your custom attribute editor (part 4)

To summarize what we’ve done so far:

  • In part 1, we created a new plugin and learned how to inject a custom editor in the ICN configuration
  • In part 2, we wrote our custom editor
  • In part 3, we wrote our custom widget

We will now deploy the plugin and use our custom editor in an entry template. Then we will add a new document using this entry template, and we should see our custom editor in used.

Deploy the plugin

Connect to ICN as an admin and go to the plugin section. Add a new plugin and use the bin folder or your project as plugin folder and set your plugin Java class. If like me, you’re running ICN on a VM, you can connect your workspace folder to your VM (shared folder if you’re using VirtualBox), that will make development easier than always packaging the plugin jar,copying it and reloading it.

ICN_editor_settings_3

Then click the Save and Close button and reload ICN to load your plugin and inject your editor.

Use the editor in an Entry Template

Open the Entry Template Manager (you might need to enable the feature in the admin desktop), then edit a template:

ICN_editor_settings_4

Click the Edit layout button to open the Entry Template Designer tool. Select one string property and choose your editor in the editor list (which should be there by now!):
ICN_editor_settings_5

Then save everything, reload the page to make sure you see your changes, and create a new document by using then entry template you updated. You should see your custom editor being used. So far nothing crazy, this is quite useless since a TextBox editor already exists, but we have everything ready to build great custom editors from now on 🙂

ICN_editor_settings_2

We are done for the basics, next parts will be about building a fancier editor, and adding some optional settings to our editor.

3 thoughts on “Create your custom attribute editor (part 4)

  1. Deep

    Hi Guillaume,

    I have created a custom string editor with a lookup button ,to override multiValued string Property.
    The problem I am facing is since it is a multivalued property, the externalError coming in console is “the value should be an array”.
    Because of which the “Add button” is not enabled.

    the console log is:

    ” 21:03:40.006 ENTRY : pvr.widget.Property.onChange
    21:03:40.017 INFO : customPropertyFillterPluginDojo.SampleTextBoxEditor.onEditorInput — “oneditorInput” — {“0”:{“value”:”102263899″,”internalError”:null,”externalError”:”The value must be an array.”}} “.

    Could you please suggest me how to achieve a custom editor with Integer Multivalued field having a lookup up button.

    Thanks,
    Deep Thakkar

    Reply
  2. George Bredis

    Hello, Guillaume!
    The article, regarding custom editors was very heplful for me, as a beginner. Especially because of loss of tutorials on ICN…
    However I have some problem.
    I use ICN 2.0.3 and its Entry Templates with the layout editor. I need to design a layout, containing some external information (e.g. provided by Web Service and brought to frontend by ICN service). It’s necessary to create somehow the widget, which will be available to layout designer – so, could be easily placed onto entry template layout in layout editor.
    My current workaround is: create a fake custom editor, containing my widget and set the input area for the property as hidden. Then some annecessary item property could be placed onto entry template layout and my custom editor is set for it. As a result property itself is not displayed on the layout, but my widget is. In principle this works, but this hoodoo looks like something abnormal.
    So, my question: is ther some other approach on how to achieve the same goal? Maybe there’s a possibility to register custom widgets in the same way as custom editors, so they will become available in layout editor, for example, in a list of containers? Or there’s no such possibility?

    Thanks in advance for the answer!
    Sincerely Yours,
    George

    Reply
  3. Ashok

    Hi Guillaume,

    I have a requirement to create scroll-able textarea.

    can you please tell me what are the necessary changes required to achieve mentioned functionality.

    Thanks in advance.

    Regards,
    Ashok B

    Reply

Leave a Reply