Add a custom class to AEM dialog

[gskittu]

Hi Team, 

I am calling a on click event of cq-dialog-submit to perform custom payload for my multifield. Here I want to add a custom class to root element of dialog, so that I can call cq-dialog-submit of my component dialog only.

I added like below in screenshot, but custom class and dialog submit btn lies in different divs.

Can u suggest me to how to get this element custom-class.cq-dialog-submit 

[Ritesh_Mittal]

Hi @gskittu ,

One way to achieve this is through jQuery. Basically you need to find granite class's parent's sibling's child and then trigger submit call.

You can check below links-

http://net-informations.com/jq/iq/parent.htm

https://stackoverflow.com/questions/16997072/how-to-select-parents-siblings-children

Thanks,

Ritesh Mittal

[gskittu]

Hi Ritesh, Thanks for your reply. Getting granite class's parent's sibling's child is happened only when we click on dialog submit

[arunpatidar]

you must use extraClientlibs instead of creating clientlibs cq.authoring.dialog category,

This will make sure the clientlib is loaded only for your dialog.

Example 

Clientlib https://github.com/arunpatidar02/aemaacs-aemlab/blob/f96ce5316dfa4798c72d2e87d3a0b41fc49791a4/ui.app... 

used only in https://github.com/arunpatidar02/aemaacs-aemlab/blob/f96ce5316dfa4798c72d2e87d3a0b41fc49791a4/ui.app... 

[gskittu]

Hi Arun, Thanks for your reply. I have already added extraclientlibs , this clientlibs loads only when dialog opened, that's ok but clientlibs are staying on site even after closing the dialog, this is causing other dialogs in same page getting effected as we used click event of cq-dialog-submit

[arunpatidar · Accepted solution]

Hi,

I think then you need to add class/data-attribute from content to form attribute on dialog load.

[gskittu]

Thanks Arun, 
It worked, added class from content to form attribute on dialog load

[Suresh Aski]

how did you add the class from content to form attribute here? can you please share the example code?
@arunpatidar 

[arunpatidar]

You can use granite:data to create data attribute
'https://developer.adobe.com/experience-manager/reference-materials/6-5/granite-ui/api/jcr_root/libs/...