Expand my Community achievements bar.

AEM6.3 coral touch ui for multifield with delimiter

Avatar

Level 8

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 .

1809107_pastedImage_1.png

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

12 Replies

Avatar

Community Advisor

what issue your facing with touch ui multifield?



Arun Patidar

Avatar

Level 8

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

Avatar

Community Advisor

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.



Arun Patidar

Avatar

Level 8

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

Avatar

Community Advisor

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



Arun Patidar

Avatar

Level 8

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.

Avatar

Level 8

Hi,

Any inputs based on last query will be helpful.

Avatar

Community Advisor

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



Arun Patidar

Avatar

Level 8

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