AEM6.3 coral touch ui for multifield with delimiter

[srinivas_chann1]

Hi ,

We use both classic UI and touch ui. In the classic UI we have multifiled which has data stored as   string[]   with values as  contentpath^textvalue  where ^ is delimiter.

Please let me know how could i achieve the same in touch ui using multifield.

Below is the snapshot for the field stored as string[] in crxde for classic UI .

The multifield i am trying is below which is not working

<staticconfig

          jcr:primaryType="nt:unstructured"

          sling:resourceType="granite/ui/components/coral/foundation/form/multifield"

          composite="{Boolean}true"

          fieldDescription="Configure Links Manually"

          fieldLabel="Manual Configuration">

           <field

            jcr:primaryType="nt:unstructured"

            sling:resourceType="granite/ui/components/coral/foundation/container"

            name="navItems">

             <items jcr:primaryType="nt:unstructured">

             <column

              jcr:primaryType="nt:unstructured"

              sling:resourceType="granite/ui/components/coral/foundation/container">

              <items jcr:primaryType="nt:unstructured">

              <path

               jcr:primaryType="nt:unstructured"

               sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"

               fieldLabel="Path"

               name="navpath"/>

              <label

               jcr:primaryType="nt:unstructured"

               sling:resourceType="granite/ui/components/coral/foundation/form/textfield"

               fieldDescription="Label of Link"

               fieldLabel="Label"

               maxlength="50"

               name="textvalue"/>

              </items>

             </column>

            </items>

           </field>

         </staticconfig>

Thanks

[srinivas_chann1]

An inputs on this

[arunpatidar]

what issue your facing with touch ui multifield?

[srinivas_chann1]

Hi,

As the property is getting stored as string[] by classic ui  with delimiter ^ ,due to this the code above i mentioned is not populating up the mutifield value in touch ui.

Any inputs as how i could solve.

Thanks

[arunpatidar]

In touch UI, Coral3, multifield data store as node, in your case it would be like navItems0, navItems1

You can easily get path and title in sling model and return as list.

[srinivas_chann1]

Hi,

It is not stored as node is stored as property navItems  of String[]  .But would want to show it up in multi-field in touch ui .hence all this issue.

Did you mean that still we can make it work using sling model. Any samples will help.

Thanks

[arunpatidar]

Hi,

I got it now, you are trying to poluate touch UI dialog from classic UI authored value.

This would be tricky, you have two options

1. Create a utility which would read the String[] property and create the nodes for touch ui multifield

2. When you open the touch ui dialog, get the value via ajax call and populate the multifield values in dailog.

I don't have any sample code though but 1st but would be easy, just authored one multifield again in touch UI and see how touch UI stores the value and converted same using utility

[srinivas_chann1]

Hi,

Thanks for the inputs .Any reference will help as currently i don't have much idea on Point1.

Point2 also using ajax we will have many multifields values in one dialog so cannot use id for populating it  and looks to me like  an issue.

[srinivas_chann1]

Hi,

Any inputs based on last query will be helpful.

[arunpatidar]

Hi Sri,

The first approach is very straight forward.

1. Create a servlet which run SQL2 query to look for the multifield resource node where data is stored in String[] type property.

2. If found, read the value of String[] type and convert into nodes and add node to above multifield resource node .

I don't know the dialog structure so couldn't exact point the steps but above is generic solution

[srinivas_chann1]

Hi,

Please let me know if the below is possible. for nested multifield

Instead of maintaining  2 separate ways of storing data for touch ui and classic ui .

I was thinking if we just have the classic UI code to make it work like touch ui requires.

As we are going away from classic UI may be in few releases from now.

So currently the touch ui will store the data as:-

menuitems

  -item0

     --navItems

       ---item0

       ---item1

But classic Ui it will store as

menuitems

  -item0    and here navItems  as string[] property.

The classic dialog has below structure

-xtype multifiled  [menuitems]

-- field2

--field2

-- inner  xtype multifield  [navItems ]

   --- inner field1

   --- inner field2

Can we have any custom CQ.Ext.reg code which will store that navItems  in nodes instead of string[] array also the  classic dialog will be able to render the inner field1 and inner field2 correctly will displaying.

Thanks

[srinivas_chann1]

Hi ,

Any inputs on my below query will helpful.

[arunpatidar]

Example:

AEM - Touch UI - Coral2 JSON store to Coral3 node store conversion demo