Solved

AEM hierarchy for multifield components.

Forum|Forum|4 years ago
July 12, 2021
2 replies
960 views

Can someone please help me with how to create hierarchy when creating multifield/multitab component?

Unable to figure out when to create item node, when to create tab node then again items node and so on.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Best answer by ChitraMadan

Please find below an example:

<?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="Image Details"
    sling:resourceType="cq/gui/components/authoring/dialog">
    <content
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/container">
        <layout
            jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/layouts/fixedcolumns"/>
        <items jcr:primaryType="nt:unstructured">
            <column
                jcr:primaryType="nt:unstructured"
                sling:resourceType="granite/ui/components/coral/foundation/container">
                <items jcr:primaryType="nt:unstructured">                  
                    <name
                        jcr:primaryType="nt:unstructured"                        
                        sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                        fieldLabel="Name"
                        name="./name"
                        required="{Boolean}true"/>
                    <description
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="cq/gui/components/authoring/dialog/richtext"
                        fieldLabel="Description"
                        name="./description"
                        useFixedInlineToolbar="{Boolean}true"/>
                    <image
                        jcr:primaryType="nt:unstructured"                       
                     sling:resourceType="granite/ui/components/foundation/form/fileupload"
                        allowUpload="{Boolean}false"
                        autoStart="{Boolean}false"
                        class="cq-droptarget"
                        fieldLabel="Logo Image"
                        fileNameParameter="./resImgName"
                        fileReferenceParameter="./fileReference"
                        mimeTypes="[image]"
                        multiple="{Boolean}false"
                        name="./restaurantImage"
                        title="Upload Image Asset"
                        uploadUrl="${suffix.path}"
                        useHTML5="{Boolean}true"/>
                    <additionalImages
                        jcr:primaryType="nt:unstructured"                                         sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                        composite="{Boolean}true"
                        fieldLabel="Additional Images">
                        <field
                            jcr:primaryType="nt:unstructured"                                                    sling:resourceType="granite/ui/components/coral/foundation/container"
                            name="./additionalImages">
                            <items jcr:primaryType="nt:unstructured">
                                <column
                                    jcr:primaryType="nt:unstructured"                                    sling:resourceType="granite/ui/components/coral/foundation/container">
                                    <items jcr:primaryType="nt:unstructured">
                                        <images
                                            jcr:primaryType="nt:unstructured"                                           sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
                                            fieldLabel="Image"
                                            name="./images"
                                            rootPath="/content/dam/"/>
                                        <title
                                            jcr:primaryType="nt:unstructured"                                           sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                                            fieldLabel="Title"
                                            name="./title"/>
                                    </items>
                                </column>
                            </items>
                        </field>
                    </additionalImages>
                </items>
            </column>
        </items>
    </content>
</jcr:root>

arunpatidar

Community Advisor

Hi,

I have a. sample component with all type fields please check https://github.com/arunpatidar02/aem63app-repo/blob/master/packages/rte/aem-rte-plugins-sample-componenet-1.zip

Arun Patidar

ChitraMadan

Accepted solution

Community Advisor

Hi @aem_form_developer,

Please find below an example:

<?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="Image Details"
    sling:resourceType="cq/gui/components/authoring/dialog">
    <content
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/container">
        <layout
            jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/layouts/fixedcolumns"/>
        <items jcr:primaryType="nt:unstructured">
            <column
                jcr:primaryType="nt:unstructured"
                sling:resourceType="granite/ui/components/coral/foundation/container">
                <items jcr:primaryType="nt:unstructured">                  
                    <name
                        jcr:primaryType="nt:unstructured"                        
                        sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                        fieldLabel="Name"
                        name="./name"
                        required="{Boolean}true"/>
                    <description
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="cq/gui/components/authoring/dialog/richtext"
                        fieldLabel="Description"
                        name="./description"
                        useFixedInlineToolbar="{Boolean}true"/>
                    <image
                        jcr:primaryType="nt:unstructured"                       
                     sling:resourceType="granite/ui/components/foundation/form/fileupload"
                        allowUpload="{Boolean}false"
                        autoStart="{Boolean}false"
                        class="cq-droptarget"
                        fieldLabel="Logo Image"
                        fileNameParameter="./resImgName"
                        fileReferenceParameter="./fileReference"
                        mimeTypes="[image]"
                        multiple="{Boolean}false"
                        name="./restaurantImage"
                        title="Upload Image Asset"
                        uploadUrl="${suffix.path}"
                        useHTML5="{Boolean}true"/>
                    <additionalImages
                        jcr:primaryType="nt:unstructured"                                         sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                        composite="{Boolean}true"
                        fieldLabel="Additional Images">
                        <field
                            jcr:primaryType="nt:unstructured"                                                    sling:resourceType="granite/ui/components/coral/foundation/container"
                            name="./additionalImages">
                            <items jcr:primaryType="nt:unstructured">
                                <column
                                    jcr:primaryType="nt:unstructured"                                    sling:resourceType="granite/ui/components/coral/foundation/container">
                                    <items jcr:primaryType="nt:unstructured">
                                        <images
                                            jcr:primaryType="nt:unstructured"                                           sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
                                            fieldLabel="Image"
                                            name="./images"
                                            rootPath="/content/dam/"/>
                                        <title
                                            jcr:primaryType="nt:unstructured"                                           sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                                            fieldLabel="Title"
                                            name="./title"/>
                                    </items>
                                </column>
                            </items>
                        </field>
                    </additionalImages>
                </items>
            </column>
        </items>
    </content>
</jcr:root>

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded