Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn More

View all

Sign in to view all badges

AEM component with multiple nested multifields renders incorrectly in authoring UI

Avatar

Avatar
Validate 1
Level 1
daniel_diaz
Level 1

Likes

0 likes

Total Posts

14 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
View profile

Avatar
Validate 1
Level 1
daniel_diaz
Level 1

Likes

0 likes

Total Posts

14 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
View profile
daniel_diaz
Level 1

27-12-2019

Hi,

I have an AEM component in which I'm trying to add two nested multifields. The component has two variations that are chosen with a drop down menu under "Choose Variation" (Image-Text Listing and Document Listing). Each variation contains a nested multifield. The Image-Text Listing renders correctly in the authoring UI:

 

https://ibb.co/DYBySjf

 

However, when you select the Document Listing variation from the drop down menu, it renders incorrectly in the authoring UI like this:

 

https://ibb.co/qkMWJM1 

 

(Sorry these imgbb links look like spam; I'm not sure how to upload an image to this forum.)

The "Document Listing Fields" is a multifield (sling:resourceType="granite/ui/components/foundation/form/multifield") that's rendering not in the correct place. But the "Image Text Listing Fields" multifield in the first image is rendering properly. Both have the exact same xml structure; the only difference is that the Document Listing multifield comes after the Image-Text Listing multifield. 

 

Is it the case that you can only have one of these nested multifields inside a component? (i.e. one "granite/ui/components/foundation/form/multifield" within a "granite/ui/components/foundation/form/multifield").

 

If it would be helpful for me to share the entire structure of the xml, please let me know. Also as a note we have AEM 6.3.3.0.

 

Thanks a lot!

 
 
 
bug multifield Nested multifield UI xml

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Coach
MVP
Arun_Patidar
MVP

Likes

1,279 likes

Total Posts

3,153 posts

Correct Reply

889 solutions
Top badges earned
Coach
Contributor 2
Ignite 10
Give Back 700
Boost 1000
View profile

Avatar
Coach
MVP
Arun_Patidar
MVP

Likes

1,279 likes

Total Posts

3,153 posts

Correct Reply

889 solutions
Top badges earned
Coach
Contributor 2
Ignite 10
Give Back 700
Boost 1000
View profile
Arun_Patidar
MVP

27-12-2019

Can you try with Coral3 resource type instead of Coral2?

granite/ui/components/coral/foundation/form/multifield

https://helpx.adobe.com/experience-manager/6-3/sites/developing/using/reference-materials/granite-ui...

 

Please post sample dialog xml so we can reproduce the issue.

 

daniel_diaz

Hi, thanks for your response @Arun_Patidar ! If I were to use the Coral3 resource type, would all the components have to be Coral3 resources? (I've been using AEM for a few months so relatively new!) Here is the xml:

 

 

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
    jcr:primaryType="nt:unstructured"
    jcr:title="Visual Listing Dialog"
    sling:resourceType="cq/gui/components/authoring/dialog">
    <content
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/foundation/container">
        <layout
            jcr:primaryType="nt:unstructured"
            sling:resourceType="granite/ui/components/foundation/layouts/tabs"/>
        <items jcr:primaryType="nt:unstructured">
            <visual-listing
                jcr:primaryType="nt:unstructured"
                jcr:title="Visual Listing Details"
                sling:resourceType="granite/ui/components/foundation/container">
                <layout
                    jcr:primaryType="nt:unstructured"
                    sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"/>
                <items jcr:primaryType="nt:unstructured">
                    <columns
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="granite/ui/components/foundation/container">
                        <items jcr:primaryType="nt:unstructured">
                            <visual-variations
                                jcr:primaryType="nt:unstructured"
                                sling:resourceType="granite/ui/components/foundation/form/select"
                                class="cq-dialog-dropdown-showhide"
                                cq-dialog-dropdown-showhide-target=".visuallistingvariation-hide-show"
                                fieldDescription="Please choose visual listing variation."
                                fieldLabel="Choose Variation"
                                id="visual-listing-variation-selection"
                                name="./visuallistingVariation"
                                required="true">
                                <items jcr:primaryType="nt:unstructured">
                                    <imagetextlisting
                                        jcr:primaryType="nt:unstructured"
                                        selected="true"
                                        text="Image-Text Listing"
                                        value="imagetextlisting"/>
                                    <documentlisting
                                        jcr:primaryType="nt:unstructured"
                                        text="Document Listing"
                                        value="documentlisting"/>
                                </items>
                            </visual-variations>
                            <imagetext-listing-fields
                                jcr:primaryType="nt:unstructured"
                                sling:resourceType="granite/ui/components/foundation/form/multifield"
                                class="tnc-parent-multifield hide visuallistingvariation-hide-show vlImg"
                                fieldLabel="Image Text Listing Fields"
                                id="hidden-fields-multifield"
                                name="./imagetextListingFields"
                                showhidetargetvalue="imagetextlisting">
                                <field
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/foundation/form/fieldset"
                                    name="./imagetextListingFields"
                                    tnc-commons-nested="JSON_STORE">
                                    <layout
                                        jcr:primaryType="nt:unstructured"
                                        sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"/>
                                    <items jcr:primaryType="nt:unstructured">
                                        <column
                                            jcr:primaryType="nt:unstructured"
                                            jcr:title="Image-Text Listing Fields"
                                            sling:resourceType="granite/ui/components/foundation/container">
                                            <layout
                                                jcr:primaryType="nt:unstructured"
                                                sling:resourceType="granite/ui/components/foundation/layouts/collapsible"/>
                                            <items jcr:primaryType="nt:unstructured">
                                                <imagelistingNestedMultifield
                                                    jcr:primaryType="nt:unstructured"
                                                    sling:resourceType="granite/ui/components/foundation/form/multifield"
                                                    class="tnc-child-multifield"
                                                    fieldLabel="CTA Links"
                                                    name="./imagelistingNestedMultifield">
                                                    <field
                                                        jcr:primaryType="nt:unstructured"
                                                        sling:resourceType="granite/ui/components/foundation/form/fieldset"
                                                        name="./imagelistingNestedMultifield">
                                                        <layout
                                                            jcr:primaryType="nt:unstructured"
                                                            sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"
                                                            method="absolute"/>
                                                        <items jcr:primaryType="nt:unstructured">
                                                            <column
                                                                jcr:primaryType="nt:unstructured"
                                                                jcr:title="CTA Link"
                                                                sling:resourceType="granite/ui/components/foundation/container">
                                                                <layout
                                                                    jcr:primaryType="nt:unstructured"
                                                                    sling:resourceType="granite/ui/components/foundation/layouts/collapsible"/>
                                                                <items jcr:primaryType="nt:unstructured">
                                                                    <cta-title
                                                                        jcr:primaryType="nt:unstructured"
                                                                        sling:resourceType="granite/ui/components/foundation/form/textfield"
                                                                        emptyText="Enter the CTA title here"
                                                                        fieldDescription="Enter the CTA title here"
                                                                        fieldLabel="CTA Title"
                                                                        id="visual-imagetext-listing-cta-title"
                                                                        name="./imgctaTitle"/>
                                                                </items>
                                                            </column>
                                                        </items>
                                                    </field>
                                                </imagelistingNestedMultifield>  
                                            </items>
                                        </column>
                                    </items>
                                </field>
                            </imagetext-listing-fields>
                            <document-listing-fields
                                jcr:primaryType="nt:unstructured"
                                sling:resourceType="granite/ui/components/foundation/form/multifield"
                                class="tnc-parent-multifield hide visuallistingvariation-hide-show vlDoc"
                                fieldLabel="Document Listing Fields"
                                id="hidden-fields-multifield"
                                name="./documentListingFields"
                                showhidetargetvalue="documentlisting">
                                <field
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/foundation/form/fieldset"
                                    name="./documentListingFields"
                                    tnc-commons-nested="JSON_STORE">
                                    <layout
                                        jcr:primaryType="nt:unstructured"
                                        sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"/>
                                    <items jcr:primaryType="nt:unstructured">
                                        <column
                                            jcr:primaryType="nt:unstructured"
                                            jcr:title="Document Listing Fields"
                                            sling:resourceType="granite/ui/components/foundation/container">
                                            <layout
                                                jcr:primaryType="nt:unstructured"
                                                sling:resourceType="granite/ui/components/foundation/layouts/collapsible"/>
                                            <items jcr:primaryType="nt:unstructured">
                                                <doclistingNestedMultifield
                                                    jcr:primaryType="nt:unstructured"
                                                    sling:resourceType="granite/ui/components/foundation/form/multifield"
                                                    class="tnc-child-multifield"
                                                    fieldLabel="CTA Links"
                                                    name="./doclistingNestedMultifield">
                                                    <field
                                                        jcr:primaryType="nt:unstructured"
                                                        sling:resourceType="granite/ui/components/foundation/form/fieldset"
                                                        name="./doclistingNestedMultifield">
                                                        <layout
                                                            jcr:primaryType="nt:unstructured"
                                                            sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"
                                                            method="absolute"/>
                                                        <items jcr:primaryType="nt:unstructured">
                                                            <column
                                                                jcr:primaryType="nt:unstructured"
                                                                jcr:title="CTA Link"
                                                                sling:resourceType="granite/ui/components/foundation/container">
                                                                <layout
                                                                    jcr:primaryType="nt:unstructured"
                                                                    sling:resourceType="granite/ui/components/foundation/layouts/collapsible"/>
                                                                <items jcr:primaryType="nt:unstructured">
                                                                    <cta-title
                                                                        jcr:primaryType="nt:unstructured"
                                                                        sling:resourceType="granite/ui/components/foundation/form/textfield"
                                                                        emptyText="Enter the CTA title here"
                                                                        fieldDescription="Enter the CTA title here"
                                                                        fieldLabel="CTA Title"
                                                                        name="./docctaTitle"/>
                                                                </items>
                                                            </column>
                                                        </items>
                                                    </field>
                                                </doclistingNestedMultifield> 
                                            </items>
                                        </column>
                                    </items>
                                </field>
                            </document-listing-fields>
                        </items>
                    </columns>
                </items>
            </visual-listing>
        </items>
    </content>
</jcr:root>

 

 

 

Arun_Patidar

Hi, It is not necessary to have all the components of Coral3 type but I would recommend you to use Coral3 components only. Coral3 is an improved version of Coral2.

I will use your sample XML and convert is into Coral2 and coral3 dialog.

daniel_diaz
Ok, thanks a lot!! I'll look into the coral3 resource types more.

Answers (0)