Image drag/drop in pathfield

forumu74220352

09-07-2019

We are working with Coral UI 3. As in classic UI , we can drag and drop image in pathfield(field will be updated with the image path on drag/drop), same does not happen in touch ui.

Is there any way to achieve the same in TOUCH UI?

Appreciate quick help on this.

Thanks!

Accepted Solutions (1)

Accepted Solutions (1)

Arun_Patidar

MVP

09-07-2019

with pathfield its not possible but with fileUpload (cq/gui/components/authoring/dialog/fileupload) it is.

References

/apps/core/wcm/components/image/v1/image

/apps/core/wcm/components/image/v1/image/cq:editConfig/cq:dropTargets

Answers (3)

Answers (3)

forumu74220352

09-07-2019

Below is my page component dialog:

<?xml version="1.0" encoding="UTF-8"?>

<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/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="Page"

    sling:resourceType="cq/gui/components/authoring/dialog"

    extraClientlibs="[cq.common.wcm,cq.siteadmin.admin.properties,cq.wcm.msm.properties,granite.contexthub.configuration]"

    mode="edit">

    <content

        jcr:primaryType="nt:unstructured"

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

        class="cq-dialog-content-page">

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

            <tabs

                granite:class="cq-siteadmin-admin-properties-tabs"

                jcr:primaryType="nt:unstructured"

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

                maximized="{Boolean}true"

                size="L">

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

                    <custom

                        jcr:primaryType="nt:unstructured"

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

                        path="/apps/myproject/components/pageComp/custom_tab"/>

                </items>

            </tabs>

        </items>

    </content>

</jcr:root>

Also, PFB custom tab xml(as mentioned in above cd:dialog, path="/apps/myproject/components/pageComp/custom_tab") :

<?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"

    cq:showOnCreate="{Boolean}true"

    jcr:primaryType="nt:unstructured"

    jcr:title="Image"

    sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">

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

        <column

            jcr:primaryType="nt:unstructured"

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

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

                <image

                    cq:showOnCreate="{Boolean}true"

                    jcr:primaryType="nt:unstructured"

                    sling:resourceType="cq/gui/components/authoring/dialog/fileupload"

                    autoStart="{Boolean}false"

                    class="cq-droptarget"

                    fileNameParameter="./image/fileName"

                    fileReferenceParameter="./image/fileReference"

                    mimeTypes="[image/gif,image/jpeg,image/png,image/webp,image/tiff]"

                    multiple="{Boolean}false"

                    name="./image/file"

                    uploadUrl="${suffix.path}"

                    useHTML5="{Boolean}true"/>

            </items>

        </column>

    </items>

</jcr:root>