Granite ui fileupload is not showin images preview

[Mafeo3]

Hi team,

I have been experiencing what I consider could be a possible issue when using the fileupload resourceType inside our component's dialog xml, same coming from:

granite/ui/components/foundation/form/fileupload

I have been doing some differente tests to see if I can find a pattern and this is what I found:

I can replicate the issue when the mentioned field is added inside a multifield but not when is under a simple container.

granite/ui/components/coral/foundation/form/multifield

XML Example:

<image
  jcr:primaryType="nt:unstructured"
  sling:resourceType="granite/ui/components/foundation/form/fileupload"
  allowUpload="{Boolean}true"
  autoStart="{Boolean}true"
  fieldLabel="Card Image"
  fileNameParameter="./imageName"
  fileReferenceParameter="./imagePath"
  mimeTypes="[image/*,video/*]"
  multiple="{Boolean}false"
  name="./image"
  uploadUrl="${suffix.path}"
  useHTML5="{Boolean}true"/>

NOTES:

• I'm working with the latest version of aem cloud sdk.
• This issue does not happen when I use the older version listed below, but the company has its own policy requirement to use the most recent and that's why I'm trying to figure out is there is any solution to this problem.

Older version of fileupload:

cq/gui/components/authoring/dialog/fileupload

Also I have a question about the mimeType attribute:

When I add a mimeType="[image/*]" as mentioned in the granite ui documentation to use whenever we want to allow any image extension, I can see that the dialog instead of showing a preview (no matter where it is located, outside or inside a multifield) starts to show only the path where the image is located, I consider this one not as a issue but as a different scenario where it is possible that what I see is actually expected (just want to make sure I'm right on this one)

Thanks for your help in advance,

[Sudheer_Sundalam · Accepted solution]

@Mafeo3 ,

This resouceType for fileupload 

granite/ui/components/foundation/form/fileupload

 is older than

cq/gui/components/authoring/dialog/fileupload

I think you should be good using "cq/gui/components/authoring/dialog/fileupload" as the resourceType rather than "granite/ui/components/foundation/form/fileupload" to stay on the newer version of fileupload which supports image preview.

If you look at the contents of "/libs/granite/ui/components/foundation/form/fileupload/render.jsp", you can see the "Adobe Copyright year mentioned as 2012" whereas for "/libs/cq/gui/components/authoring/dialog/fileupload/render.jsp", you see that "Adobe Copyright year mentioned as 2016" confirming that "cq/gui/components/authoring/dialog/fileupload" is newer than the other.

[Mafeo3]

@Sudheer_Sundalam thank you so much for your help, that work for me, I appreciate the quick answer.

[kautuk_sahni]

@Mafeo3 Did you find the suggestions from users helpful? Please let us know if more information is required. Otherwise, please mark the answer as correct for posterity. If you have found out solution yourself, please share it with the community.