Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

Image Fileupload using Coral 3 drag and drop

Avatar

Level 2

I am looking for a way to drag and drog image file using coral 3 within the dialog (as shown below). 

1736544_pastedImage_1.png

I was able to do this with coral 2 and was wondering how to do it with coral 3.

Can someone provide me the code to do this?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi,

You can't do that with coral3 but you can use foundation fileupload

cq/gui/components/authoring/dialog/fileupload

OR use pathfield to browse images.

PathField — Granite UI 1.0 documentation



Arun Patidar

View solution in original post

8 Replies

Avatar

Level 2

I already looked at the documentation, it does not show how to create a drag and drop fileupload.  The fileupload changed dramatically from it's previous version.  The documentation does not show an example on how to do this.

I would like a working sample.  Please provide a working example in xml.

Avatar

Level 2

Hi rmahendra

I am looking for a dialog with a fileupload (in coral 3) that we can drag and drop the image.

The example you gave me does not have a coral 3 fileupload.

Avatar

Correct answer by
Community Advisor

Hi,

You can't do that with coral3 but you can use foundation fileupload

cq/gui/components/authoring/dialog/fileupload

OR use pathfield to browse images.

PathField — Granite UI 1.0 documentation



Arun Patidar

Avatar

Level 2

Hey Arun,

You are saying that it is not possible.

Was it designed that way?  Or is it a bug?

Avatar

Community Advisor

I think it is by designed because if you compare coral2 and Granite fileupload

Granite FileUpload — Granite UI 1.0 documentation

Coral2 FileUpload — Granite UI 1.0 documentation

below properties have been removed from Granite fileupload which is used to browse assets from dam

fileNameParameter

The parameter representing the file name, for instance “./fileName” or “./image/fileName”. It will be used to determine the (relative) location where to store the name of the file.

fileReferenceParameter

The location where to store the reference of the file (when a file already uploaded on the server is used), usually ./fileReference or ./image/fileReference. NB: This is only working in the context of AEM Authoring



Arun Patidar

Avatar

Level 4
Where you looking to Drag and Drop from the Asset Finder or were you looking to drop a file to upload it from the computer desktop?