Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Nested multi field in touch UI- AEM 6.3

Avatar

Level 2

I am trying to implement nested multi fields in touch UI. I have tried below example and it worked fine.

Experiencing Adobe Experience Manager - Day CQ: AEM 63 - Touch UI Nested ( Multi-Multi ) Coral 2 Com...

However, if I add any new fields after multifield(highlighted in bold) , dialog is not getting rendered correctly.  It seems like nested multi fields are working only if the multifield is the last element in the corresponding container. Please let me know if there is any work around for this issue.

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

     <dashboard

            jcr:primaryType="nt:unstructured"

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

            fieldDescription="Enter Dashboard name"

            fieldLabel="Dashboard name"

    name="./dashboard"/>

<countries

       jcr:primaryType="nt:unstructured"

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

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

            <country

                 jcr:primaryType="nt:unstructured"

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

                 fieldDescription="Name of Country"

                 fieldLabel="Country Name"

                 name="./country"/>

            <states

                 jcr:primaryType="nt:unstructured"

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

                      ......

                      ......

                      .....

            </states>

           <country2

                 jcr:primaryType="nt:unstructured"

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

                 fieldDescription="Name of Country2"

                 fieldLabel="Country Name2"

                 name="./country2"/>

  </items>

</countries>

<dashboard_2

  jcr:primaryType="nt:unstructured"

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

  fieldDescription="Enter Dashboard name"

  fieldLabel="Dashboard name12"

  name="./dashboard_2"/>

</items>

1 Accepted Solution

Avatar

Correct answer by
Level 2

Hi Vivek,

You might see that error if ACS Commons is installed(it has custom multi field implementation) or any other custom multi-field implementation. Make sure you have only one implementation of below code.

CUI.Multifield = new Class({

_addListeners: function () {

}

});

  CUI.Widget.registry.register("multifield", CUI.Multifield);

Thanks

View solution in original post

7 Replies

Avatar

Community Advisor

Any sample content package to replicate this behavior?

Avatar

Community Advisor

Are you getting following on opening dialog(check browser console) :

"Uncaught RangeError: Maximum call stack size exceeded"

Avatar

Administrator

I have asked Sreekanth to have a look at this one.

~kautuk



Kautuk Sahni

Avatar

Correct answer by
Level 2

Hi Vivek,

You might see that error if ACS Commons is installed(it has custom multi field implementation) or any other custom multi-field implementation. Make sure you have only one implementation of below code.

CUI.Multifield = new Class({

_addListeners: function () {

}

});

  CUI.Widget.registry.register("multifield", CUI.Multifield);

Thanks

Avatar

Community Advisor

So, I was able to see the behavior partially.. What I observed is:

- Dashboard name12 is working fine for me as it is outside the outer multifield(country).

- Country Name2 is not working as expected when moved below inner multifield but still inside outer multifield.

The dialog doesnt seem to get rendered correctly. When moved below inner multifield, "Country Name2" is rendered outside the multifield, which is incorrect.

It appears to be a product bug. The way fields are rendered by ComponentHelper class seems to be causing the issue.

Avatar

Community Advisor

smacdonald2008​: This is just a clarification and not the correct answer. The issue is still there