Add a custom class to AEM dialog | Community
Skip to main content
G
gskittu
Level 2
February 8, 2023
Solved

Add a custom class to AEM dialog

  • February 8, 2023
  • 2 replies
  • 3199 views

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 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by arunpatidar

Hi,

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

 

2 replies

Ritesh_Mittal
Community Advisor and Adobe Champion
Ritesh_MittalCommunity Advisor and Adobe Champion
Community Advisor and Adobe Champion
February 8, 2023

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

 

    G
    gskittuAuthor
    Level 2
    February 8, 2023

    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
    Community Advisor
    arunpatidarCommunity Advisor
    Community Advisor
    February 8, 2023

    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.apps/src/main/content/jcr_root/apps/aemlab/oneweb/concept/clientlibs/author/clientlib-dialog-sidepanel-toggle/.content.xml#L4 

    used only in https://github.com/arunpatidar02/aemaacs-aemlab/blob/f96ce5316dfa4798c72d2e87d3a0b41fc49791a4/ui.apps/src/main/content/jcr_root/apps/aemlab/oneweb/concept/components/image/_cq_dialog/.content.xml#L6 

    Arun Patidar
      G
      gskittuAuthor
      Level 2
      February 8, 2023

      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
      Community Advisor
      arunpatidarCommunity AdvisorAccepted solution
      Community Advisor
      February 8, 2023

      Hi,

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

       

      Arun Patidar
        Terms & ConditionsAccessibility statement

        Loading footer...