Topic
  • 11 replies
  • Latest Post - ‏2015-02-20T14:20:19Z by kshetty007
MatteoMarzuola
MatteoMarzuola
11 Posts

Pinned topic ICN 2.01 Customizing Work Item Properties Pane Layout

‏2013-04-17T12:33:30Z |

Hi all,

I need to customize in ICN 2.0.1 the layout of the Work Item Properties Pane showed in the step processor page when a work item is opened (style, order of the properties and enable javascript controls on some fields depending on the action chosen by the user from those ​​available by the workflow).

The default panel shows the properties in the order indicated by the symbolic name of the properties defined in my workflow (
the file in attachment shows the print screen of the current situation).

I have to group the properties according certain criteria; for example the set of the readonly properties in a subpanel, a set of other properties in a second subpanel, etc...

Reading the redbook "Customizing_Extending_IBM_Content_Navigator" I saw an example on how to implement a layout plugin, but this case, it is only an assembly of different panels.

I need to override the function that retrieves the attributes of the opened work item and modify the rendering of these on the properties panel.

Anlalyzing the javascript code of the widget WorkItemPropertiesPane.js, I found the function _retrieveAttributes, but I do not understand how it works (in attachment there is also the widget code)

Can anyone suggest me a starting point to extend the widget and achieve the desired behavior?

 

  • MatteoMarzuola
    MatteoMarzuola
    11 Posts

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-04-19T15:36:34Z  

    Hi all,

    sorry for my reply but I urgently need help for this topic because we are stuck with the developments on ICN and within 20 days we should go in production environment...

    I can not find any further documentation about this question...

    Please help...

     

    Thanks in advance

     

  • damorris
    damorris
    825 Posts

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-04-22T11:41:19Z  

    Hi all,

    sorry for my reply but I urgently need help for this topic because we are stuck with the developments on ICN and within 20 days we should go in production environment...

    I can not find any further documentation about this question...

    Please help...

     

    Thanks in advance

     

    There is an example of how to do this in the sample plugin.  The file name is SampleItemPropertiesPaneExtension.js.  You should not need to look at the core code of ICN.  Generally, you should not call any methods marked with an _ as those are private and subject to change from release to release.

  • MatteoMarzuola
    MatteoMarzuola
    11 Posts

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-04-29T09:15:49Z  
    • damorris
    • ‏2013-04-22T11:41:19Z

    There is an example of how to do this in the sample plugin.  The file name is SampleItemPropertiesPaneExtension.js.  You should not need to look at the core code of ICN.  Generally, you should not call any methods marked with an _ as those are private and subject to change from release to release.

    Hi Dana,

    I already seen that example, but in my context I have not only modify the layout of the properties pane, but also add javascript contrlos on the buttons created from the work item list property f_Responses.

    The widget WorkItemPropertiesPane uses other components such as ProcessorButtonBar and _ProcessorMixin, to build dinamically response buttons, looping the f_Responses array and attaching a function on the onclick event that calls the function onOk of the StepProcessorLayout widget.

    I would modify this behavior executing a validation control on the value of some fields of the properties pane (the group of fields to check is different depending on the type of response).

    Any suggest on how to obtain this behavior and which method extend?

    Thanks in advance.

     

  • JanEOU
    JanEOU
    3 Posts

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-05-04T04:02:09Z  
    • damorris
    • ‏2013-04-22T11:41:19Z

    There is an example of how to do this in the sample plugin.  The file name is SampleItemPropertiesPaneExtension.js.  You should not need to look at the core code of ICN.  Generally, you should not call any methods marked with an _ as those are private and subject to change from release to release.

    Hi Damorris  !

    I have a question about adding javascript in my application, for example, if I already created javascript "SampleItemPropertiesPaneExtension.js" how can I use, display it in my console?

    Any instructions or examples will be helpful for me.

    thanx in advance.

  • damorris
    damorris
    825 Posts

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-05-05T12:13:00Z  
    • JanEOU
    • ‏2013-05-04T04:02:09Z

    Hi Damorris  !

    I have a question about adding javascript in my application, for example, if I already created javascript "SampleItemPropertiesPaneExtension.js" how can I use, display it in my console?

    Any instructions or examples will be helpful for me.

    thanx in advance.

    You have to create a plugin.  There is an example of how to extend the existing ItemPropertiesPaneExtension in the <INSTALLATION_DIR>/samples/samplePlugin directory.  After you've created your plugin you install it on the plugins page of the ICN administration.

  • JanEOU
    JanEOU
    3 Posts

    Ответ: Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-05-06T11:29:14Z  
    • damorris
    • ‏2013-05-05T12:13:00Z

    You have to create a plugin.  There is an example of how to extend the existing ItemPropertiesPaneExtension in the <INSTALLATION_DIR>/samples/samplePlugin directory.  After you've created your plugin you install it on the plugins page of the ICN administration.

    How to create plugin I know.

    Is it correct steps which I am doing:

    1. Create plugin.

    2. Create, for example, SamplePropertiesPaneExtention extended it from ItemPropertiesPaneExtention.

    3. Then I register by following way:

    // Register the custom item properties editor with the ItemPropertiesPaneecm.widget.ItemPropertiesPane.addExtension(samplePluginDojo.SampleItemPropertiesPaneExtension);

    4. Last step install plugin in ICN Administrator.

     

    Explain how and at what point my created SampleItemPropertiesPaneExtension  plugin replace the standard plugin.

    In  SamplePlugin example not clearly explained how to add your newly created widget.

     

     

  • damorris
    damorris
    825 Posts

    Ответ: Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-05-06T12:07:53Z  
    • JanEOU
    • ‏2013-05-06T11:29:14Z

    How to create plugin I know.

    Is it correct steps which I am doing:

    1. Create plugin.

    2. Create, for example, SamplePropertiesPaneExtention extended it from ItemPropertiesPaneExtention.

    3. Then I register by following way:

    // Register the custom item properties editor with the ItemPropertiesPaneecm.widget.ItemPropertiesPane.addExtension(samplePluginDojo.SampleItemPropertiesPaneExtension);

    4. Last step install plugin in ICN Administrator.

     

    Explain how and at what point my created SampleItemPropertiesPaneExtension  plugin replace the standard plugin.

    In  SamplePlugin example not clearly explained how to add your newly created widget.

     

     

    The SamplePlugin shows a very specific example of how to add properties to the Item properties pane.  The SampleItemPropertiesPaneExtension.js references and extends the ICN provided extension point called ItemPropertiesPaneExtension.  Basically, we've provided the ItemPropertiesPaneExtension widget so that you can easily add properties without having to completely replace / override the existing itemPropertiesPane widget.  If you deploy the existing sample plugin it will add a new section to the properties pane called "Sample Plugin Custom Properties".

     

  • JanEOU
    JanEOU
    3 Posts

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-05-14T07:44:22Z  
    • damorris
    • ‏2013-05-06T12:07:53Z

    The SamplePlugin shows a very specific example of how to add properties to the Item properties pane.  The SampleItemPropertiesPaneExtension.js references and extends the ICN provided extension point called ItemPropertiesPaneExtension.  Basically, we've provided the ItemPropertiesPaneExtension widget so that you can easily add properties without having to completely replace / override the existing itemPropertiesPane widget.  If you deploy the existing sample plugin it will add a new section to the properties pane called "Sample Plugin Custom Properties".

     

    I deployed sample plugin but I can not see new section in the property pane. Can you make screenshot of your CN where you added it?
  • jsaad
    jsaad
    1 Post

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2013-07-26T23:04:03Z  

    Hi Matteo,

    Have you been able to find out a solution yet? We are currently struggling with the same issue since we need to create a custom WorkItemPropertiesPane from the scratch instead of using the ItemPropertiesPaneExtension.

    I don´t really think there is an easy way to build a custom fields pane in order to change simple things such as fields position or size.

    Please keep us updated in case you can sort it out.

    Thanks

  • Yin.Lin
    Yin.Lin
    9 Posts

    Ответ: Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2014-12-11T16:09:02Z  
    • damorris
    • ‏2013-05-06T12:07:53Z

    The SamplePlugin shows a very specific example of how to add properties to the Item properties pane.  The SampleItemPropertiesPaneExtension.js references and extends the ICN provided extension point called ItemPropertiesPaneExtension.  Basically, we've provided the ItemPropertiesPaneExtension widget so that you can easily add properties without having to completely replace / override the existing itemPropertiesPane widget.  If you deploy the existing sample plugin it will add a new section to the properties pane called "Sample Plugin Custom Properties".

     


    I tried with  ItemPropertiesPaneExtension widget in sample plugin, I can see new section of the property pane in html source, But not displayed on the screen. Any ideas? Thanks in advance.

  • kshetty007
    kshetty007
    6 Posts

    Re: ICN 2.01 Customizing Work Item Properties Pane Layout

    ‏2015-02-20T14:20:19Z  

    Changing the order of the properties being displayed on the Step Processor can be accomplished using response filters.