Unable to render image in multifield | Community
Skip to main content
S
Sanjana12
September 12, 2022
Solved

Unable to render image in multifield

  • September 12, 2022
  • 2 replies
  • 1914 views

I'm trying to render image in multifield. I used the path 

cq/gui/components/authoring/dialog/fileupload

but still it's not working. Please help 

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 Sanjana12

@sanjana12 

Could you please share your code here to verify.


<?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="My Multifield"
          sling:resourceType="cq/gui/components/authoring/dialog">
    <content
            jcr:primaryType="nt:unstructured"
            sling:resourceType="granite/ui/components/coral/foundation/container">
        <items jcr:primaryType="nt:unstructured">
            <tabs
                    jcr:primaryType="nt:unstructured"
                    sling:resourceType="granite/ui/components/coral/foundation/tabs"
                    maximized="{Boolean}true">
                <items jcr:primaryType="nt:unstructured">
                    <properties
                            jcr:primaryType="nt:unstructured"
                            jcr:title="Properties"
                            sling:resourceType="granite/ui/components/coral/foundation/container"
                            margin="{Boolean}true">
                        <items jcr:primaryType="nt:unstructured">
                            <columns
                                    jcr:primaryType="nt:unstructured"
                                    sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns"
                                    margin="{Boolean}true">
                                <items jcr:primaryType="nt:unstructured">
                                    <column
                                            jcr:primaryType="nt:unstructured"
                                            sling:resourceType="granite/ui/components/coral/foundation/container">
                                        <items jcr:primaryType="nt:unstructured">

                                            <well
                                                    jcr:primaryType="nt:unstructured"
                                                    sling:resourceType="granite/ui/components/coral/foundation/well"
                                                    fieldLabel="Link">
                                                <items jcr:primaryType="nt:unstructured">
                                                    <details
                                                            jcr:primaryType="nt:unstructured"
                                                            sling:resourceType="granite/ui/components/coral/foundation/form/multifield"
                                                            composite="{Boolean}true"
                                                            fieldLabel="Details">
                                                        <field
                                                                jcr:primaryType="nt:unstructured"
                                                                sling:resourceType="granite/ui/components/coral/foundation/container"
                                                                name="./multifield">
                                                            <items jcr:primaryType="nt:unstructured">
                                                                <column
                                                                        jcr:primaryType="nt:unstructured"
                                                                        sling:resourceType="granite/ui/components/coral/foundation/container">
                                                                    <items jcr:primaryType="nt:unstructured">
                                                                        <country
                                                                                jcr:primaryType="nt:unstructured"
                                                                                sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                                                                                fieldLabel="Country"
                                                                                name="./country"/>
                                                                        <description
                                                                                jcr:primaryType="nt:unstructured"
                                                                                sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                                                                                fieldLabel="Description"
                                                                                name="./description"/>
                                                                        <fileupload
                                                                                jcr:primaryType="nt:unstructured"
                                                                                sling:resourceType="cq/gui/components/authoring/dialog/fileupload"
                                                                                allowUpload="{Boolean}false"
                                                                                autoStart="{Boolean}false"
                                                                                class="cq-droptarget"
                                                                                fieldLabel="Image"
                                                                                fileNameParameter="./fileName"
                                                                                fileReferenceParameter="./fileReference"
                                                                                mimeTypes="[image/gif,image/jpeg,image/png,image/webp,image/svg+xml]"
                                                                                multiple="{Boolean}false"
                                                                                name="./fileName"
                                                                                title="Upload an image asset:"
                                                                                uploadUrl="${suffix.path}"
                                                                                useHTML5="{Boolean}true"/>
                                                                        <label
                                                                                jcr:primaryType="nt:unstructured"
                                                                                sling:resourceType="granite/ui/components/coral/foundation/form/textfield"
                                                                                fieldLabel="Button Label"
                                                                                name="./label"/>
                                                                        <link
                                                                                jcr:primaryType="nt:unstructured"
                                                                                sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
                                                                                fieldLabel="Button Link"
                                                                                name="./link"/>

                                                                    </items>
                                                                </column>
                                                            </items>
                                                        </field>
                                                    </details>

                                                </items>
                                            </well>


                                        </items>
                                    </column>
                                </items>
                            </columns>
                        </items>
                    </properties>
                </items>
            </tabs>
        </items>
    </content>
</jcr:root>

2 replies

G
Community Advisor
GanthiRa1Community Advisor
Community Advisor
September 12, 2022

Hi @sanjana12 

Please verify this post and your dialog xml as below,

<fileupload
    jcr:primaryType="nt:unstructured"
    sling:resourceType="cq/gui/components/authoring/dialog/fileupload"
    autoStart="{Boolean}false"
    class="cq-droptarget"
    fieldLabel="Image asset"
    fileNameParameter="./fileName"
    fileReferenceParameter="./fileReference"
    mimeTypes="[image/gif,image/jpeg,image/png,image/tiff,image/svg+xml]"
    multiple="{Boolean}false"
    name="./file"
    title="Upload Image Asset"
    uploadUrl="${suffix.path}"
    useHTML5="{Boolean}true"/>

    S
    Sanjana12Author
    September 12, 2022

    mine is the same but the image is still not getting displayed on the page

      G
      Community Advisor
      GanthiRa1Community Advisor
      Community Advisor
      September 12, 2022

      @sanjana12 

      Refer this documentation.

      Are you able to verify the image getting saved in content node of the page? 

        ksh_ingole7
        Community Advisor
        ksh_ingole7Community Advisor
        Community Advisor
        September 12, 2022

        Hi @sanjana12 

         

        Kindly confirm if you are able to see :

        1. fileReference property in the /content/<component-path> and is it having the expected DAM path.

         

        If yes,

        Try to debug the Java code. See if the list that you are trying to return has the fileReference path as expected.

         

        Thanks

         

         

          S
          Sanjana12Author
          September 12, 2022

          the fileReference path in the java code is correct

            G
            Community Advisor
            GanthiRa1Community Advisor
            Community Advisor
            September 12, 2022

            @sanjana12 

            Did you verify the src="${item.fileReference}" has the proper image? 

              Terms & ConditionsAccessibility statement

              Loading footer...