Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

Touch UI Dialogs Stripping out Custom Data Elements

Avatar

Level 3

I've been working through several examples for AEM 6.0/6.1 online to hide/show elements on my AEM 6.3 dialog and I have the listener JS functions properly firing finally but the issue seems to be with the removal of customer data elements from the Touch UI dialog fields when the dialog is created.

One such example AEM 6 Touch UI Show/Hide Checkbox associated  panels . It enables hiding/unhiding of other component...

For instance with the code provided below the elements are created in the dialog but the show-hide-target, should-show-when-checked fields are not being created and the class field doesn't seem to be updating either if I leave it as class instead of wrapperClass like i have below which will at least set the class correctly on the wrapping div tag.

So the question is based on .content.xml for my dialog.  How do I properly set the class and add other elements to the TouchUI dialog for AEM 6.3 so that my extra elements aren't removed.

      <option jcr:primaryType="nt:unstructured"

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

                            text="Show other fields"

                            fieldDescription="Anchor heading will only be visible in the navigation bar"

                            name="./showInNavOnly"

                            value="true"

                           show-hide-target="show-dropDown-panel"

                            should-show-when-checked="false"

                            wrapperClass="cq-dialog-checkbox-showhide"/>

<setChildren

                            jcr:primaryType="nt:unstructured"

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

                            wrapperClass="hidden showhide-target"

                            id="show-dropDown-panel">

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

                            <testing

                                        jcr:primaryType="nt:unstructured"

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

                                        fieldDescription="TESTING FIELD"

                                        fieldLabel="TESTING FIELD"

                                        name="./testing"/>

                                        </items>

                        </setChildren>

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi,

You probably using the Coral2 components try with Granite/coral3 e.g.

granite/ui/components/coral/foundation/form/checkbox

granite/ui/components/coral/foundation/form/select

add granite:data node as a child node of an item.

Screen Shot 2018-08-21 at 8.21.44 PM.png

Screen Shot 2018-08-21 at 8.20.23 PM.png

Thanks

Arun



Arun Patidar

View solution in original post

4 Replies

Avatar

Community Advisor

Hi,

Coral3/Granite components only retain data attribute if you added those in granite:data node.

Add granite:node as items child node.

Common Attributes — Granite UI 1.0 documentation

Screen Shot 2018-08-21 at 6.04.34 PM.png



Arun Patidar

Avatar

Level 3

Do you know of any examples of adding this new granite:data node to things like a select or checkbox?  I tried a few variants by adding it as another filed within that element and outside of it with no luck getting it to display the extra fields.

Avatar

Correct answer by
Community Advisor

Hi,

You probably using the Coral2 components try with Granite/coral3 e.g.

granite/ui/components/coral/foundation/form/checkbox

granite/ui/components/coral/foundation/form/select

add granite:data node as a child node of an item.

Screen Shot 2018-08-21 at 8.21.44 PM.png

Screen Shot 2018-08-21 at 8.20.23 PM.png

Thanks

Arun



Arun Patidar