Expand my Community achievements bar.

Guidelines for the Responsible Use of Generative AI in the Experience Cloud Community.

Fileupload coral3 resource-type not working.

Avatar

Level 2

I am trying to migrate a component from Coral 2 to Coral 3. We have a sling:resourceType= granite/ui/components/foundation/form/fileupload which we changed to granite/ui/components/coral/foundation/form/fileupload. But after doing so the component dialog doesn't open.

 

I looked at the OOTB AEM core image component at this location (/apps/core/wcm/components/image/v1/image) and got surprised that its using “cq/gui/components/authoring/dialog/fileupload”, instead of coral-3 resource type (/libs/granite/ui/components/coral/foundation/form/fileupload). All other nodes in this component are using coral-3 resource-type, but not the fileupload. Is there any reason for that?

 

We went ahead with the cq/gui/components/authoring/dialog/fileupload, but this is breaking our Alt Text validation functionality. Can you please let me know why in Coral3 granite/ui/components/coral/foundation/form/fileupload is not being used?

9 Replies

Avatar

Community Advisor

HI @ks_hitijingole 

 

Which version of AEM you are finding this issue?

 

Update:

Please try with the below code. It works on AEM 6.5

 

<image
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/form/fileupload"
autoStart="{Boolean}false"
fieldLabel="Image"
class="cq-droptarget"
fieldDescription="Configure Image"
fileNameParameter="./fileName"
fileReferenceParameter="./fileReference"
mimeTypes="[image/gif,image/jpeg,image/png,image/tiff,image/svg+xml]"
multiple="{Boolean}false"
name="./file"
text="Upload"
title="Upload Image Asset"
useHTML5="{Boolean}true"/>

 

Ensure to remove "uploadUrl" if you are not using the "autoStart" as "true". The URL to upload the file. This is only required when autoStart is true.

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

 

asutosh_jena_0-1619074704698.png

 

 

Thanks!

Avatar

Community Advisor

Hi @ks_hitijingole 

 

Please try with above code. It should work.

 

Thanks!

Avatar

Level 2

Hi @Asutosh_Jena_ , I tried with the above code. But it did not work for me. The Drag and drop field appears to be broken.

 

Please find attached content.xml for the node :

 

 

<mediaContianer
                                jcr:primaryType="nt:unstructured"
                                sling:resourceType="granite/ui/components/coral/foundation/form/fileupload"
                                allowUpload="{Boolean}false"
                                autoStart="{Boolean}false"
                                class="cq-droptarget"
                                fieldDescription="Upload Image(Expected Image for inside view size:2880x1404 and for outside view size:1072x912)"
                                fieldLabel="Roche Dam asset"
                                fileNameParameter="./mediaContainer"
                                fileReferenceParameter="./fileReference"
                                mimeTypes="[image,video/.*]"
                                multiple="{Boolean}false"
                                name="./mediaContainer"
                                required="{Boolean}true"
                                title="Upload Image Asset"
                                useHTML5="{Boolean}true"/>

 

 

ks_hitijingole_0-1619089060193.png

 

Avatar

Community Advisor
If you want the drag and drop functionality you need to use cq/gui/components/authoring/dialog/fileupload

Avatar

Community Advisor

I would recommend to use cq/gui/components/authoring/dialog/fileupload orgranite/ui/components/foundation/form/fileupload instead of granite/ui/components/coral/foundation/form/fileupload, coral3 fileupload does not provide functionality to browse assets from AEM DAM. you can only upload from local.



Arun Patidar

Avatar

Level 2
Hey @arunpatidar, is it okay to use a Coral UI 2 resourceType while other nodes in the component are in Coral UI 3?

Avatar

Community Advisor
Hi, This is totally fine to use coral2 or foundations. Coral3 are the upgraded one with bug fixes and improvements but if that does not fulfill your requirement you can use coral2 or foundation.


Arun Patidar

Avatar

Community Advisor

Hi @kautuk_sahni 

  As drag n drop does not work with coral3 fileupload</libs/granite/ui/components/coral/foundation/form/fileupload>. Can you confirm if is this bug or this is how it is supposed to work.

Thanks

Dipti Chauhan