Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

[AEM Gems Webinar] Accelerating Experience Manager as a Cloud Service development with Rapid Development Environments
Adobe Summit 2023 | Complete list of AEM Sessions & Labs
SOLVED

Displaying an image in Touch UI Dialog

Avatar

Level 2

Can anyone help me with a way in which I can display an image inside a Dialog as display either by :

1. Inserting a screenshot/image inside a fieldDescription against a field in Touch UI dialog

2. Inserting a screenshot/image in Touch UI dialog as similar to displaying using displayfield xtype and setting fieldDescription property value as <img src="path of the image from DAM">  in classic UI

 

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi,

I had this use case in my mind for touch UI and I have done a small PoC as well.

The idea is to :

1. add a property to the field node called, fieldDescriptionImage

2. Write a javascript to read this property from DAM and inject it in the description area inside img tag.

 

Note : I don't exactly remember if I use properties or granite:data to add fieldDescriptionImage value.

I will share the javascript code if I am able to find it.

 

 

 

 

View solution in original post

6 Replies

Avatar

Community Advisor

In touch UI dialog we have a resourceType "cq/gui/components/authoring/dialog/fileupload" if you use it for a dialog then at the time of browsing only you will have the preview of the asset.

See the below of the image core component for reference.

/apps/core/wcm/components/image/v2/image/cq:dialog/content/items/tabs/items/asset/items/columns/items/column/items/file.

 

Hope this will help.

Umesh Thakur

 

 

Avatar

Correct answer by
Community Advisor

Hi,

I had this use case in my mind for touch UI and I have done a small PoC as well.

The idea is to :

1. add a property to the field node called, fieldDescriptionImage

2. Write a javascript to read this property from DAM and inject it in the description area inside img tag.

 

Note : I don't exactly remember if I use properties or granite:data to add fieldDescriptionImage value.

I will share the javascript code if I am able to find it.