Expand my Community achievements bar.

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

How to use the AEM Asset Selector in a dialog?

Avatar

Level 3

As per document Asset Selector ,   http://localhost:4502/aem/assetpicker.html?dialog=true  Use these parameters to open the asset selector as Granite Dialog. This option is only applicable when you launch the asset selector through Granite Path Field, and configure it as pickerSrc URL.

I tried the following code in the dialog XML:

<image
  
jcr:primaryType="nt:unstructured"
  
sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
  
name="./videoThumbnail"
  
pickerSrc="/aem/assetpicker.html?dialog=true"

   mimeType="image"
  
rootPath="/content/dam"/>

The pathfield above does not seems to use the alternative picker specified by the pickerSrcand behaves like a standard pathfield.

Also tried adding the extra URL parameters as specified in the pathfield docs but that made no change.

Please provide ur inputs how to configure assetpicker in dialog.

Regards,

Kalyan.

1 Accepted Solution

Avatar

Correct answer by
Level 7

Hi,

i've created a demo package which works in AEM 6.4.

You can find it here [0].

Let me know if you need more info.

[0] WeTransfer

Thanks,

Antonio

View solution in original post

18 Replies

Avatar

Level 10

WHat are you trying to perform with the PathField - i am looking at http://localhost:4502/aem/assetpicker.html and it looks like its functioning properly.

Avatar

Level 3
smacdonald2008

I want to launch the asset selector through Granite Path Field​ in dialog, for image asset selection.

Regards,

Kalyan

Avatar

Employee

Did you find a solution for this? Would you mind sharing?

Avatar

Community Advisor

It does works if you'll be using below path for pickerSrc

/libs/dam/gui/content/assetselector/jcr:content/body/items/assetselector.html?dialog=true&assettype=images&root=/content/dam/we-retail/en/activities

Thanks

Arun



Arun Patidar

Avatar

Level 2

The pickerSrc is not working with values "

/libs/dam/gui/content/assetselector/jcr:content/body/items/assetselector.html?dialog=true& assettype=images&root=/content/dam/we-retail/en/activities"

or

"/aem/assetpicker.html?dialog=true" anyone got the assetpicker ?

Avatar

Community Advisor

use /libs/dam/gui/content/assetselector/jcr:content/body/items/assetselector.html?dialog=true

but still there is a bug, it will not allow selecting assets from assets selector.

you can log a daycare ticket.



Arun Patidar

Avatar

Level 3

Hi @arunpatidar 

 

Do you know if this issue is tracked and/or planned to be fixed?

 

Regards,

Alexander

Avatar

Community Advisor

Hi @Alexander_Prikhodko 
Not sure if user reported the issue or not. I did not reported anything though.



Arun Patidar

Avatar

Correct answer by
Level 7

Hi,

i've created a demo package which works in AEM 6.4.

You can find it here [0].

Let me know if you need more info.

[0] WeTransfer

Thanks,

Antonio

Avatar

Level 4

Not able to view the attached package for the answer that is marked correct. Can you please post the solution again?

Avatar

Level 4

Did you get solution, I am looking to do same on aem 6.5 page dialog thumbnail.

@kalyanc42390873  @antoniom5495929 @arunpatidar @Maruti_Prasad 

Avatar

Level 5

Hi @arunpatidar 

Above solution is not working for me.

But it works with below solution : https://stackoverflow.com/questions/51366697/how-to-use-the-aem-asset-selector-in-a-coral3-dialog

 

One issue here is , let's say I have selected one image at path /content/dam/xyz/steps/image1.png

and now if I click on the pathfiled it will again take me to /content/dam/xyz instead of image path .

 

@arunpatidar could you please let us know where can i find the tutorial or any article regarding coral 3 granite framework which are helpfull for dialog customization. How did you learn.

Thanks

Avatar

Level 5

@arunpatidar  it is failing while assigning the value back to pathfiled :

 

else {
var selectedItem = document.querySelector(SELECTORS.SELECTED_ITEM).getAttribute(SELECTORS.ITEM_ATTR);
document.querySelector(SELECTORS.PATHFIELD_SELECTOR).value = selectedItem;
}

value of document.querySelector(SELECTORS.PATHFIELD_SELECTOR) coming as null hence removed 

const PATHFIELD_TARGET = '.pathfield__asset--selector';
from 
PATHFIELD_SELECTOR: PATHFIELD_TARGET + ' input[aria-controls="asset-selector-launcher-setting"]',
 
then it was assigning the value properly back to pathfiled but when I submit the dialog it is not persisting , old value is still there.

 

Avatar

Level 5

Hi @arunpatidar 

 

I am using AEMaaCS and it is not working for me.

The value is getting added to pathfiled after selection but it is not persisited because. value of pathfiled is coming from coral-taglist > coral-tag > coral-tag-label .

 

and also as i tol earlier it works fine with pickersrc= 

/mnt/overlay/dam/cfm/admin/content/v2/associated-content/assetpicker.html?root=/content/dam&amp;mode=single&amp;filter=nosystem

But I am not sure should I use this or ur one.

Avatar

Community Advisor

If other is working then you can use it

 

I am not sure if you are doing something wrong while using the other one because it works for me. I can see the values are saved and persisting and I can see when I open dialog again.

 

chrome-capture-2022-7-4.gif



Arun Patidar