Unable to hide Tab in dialog based on checkbox when dialog opened | Community
Skip to main content
praveenk9057427
praveenk9057427
Level 2
August 25, 2021
Solved

Unable to hide Tab in dialog based on checkbox when dialog opened

  • August 25, 2021
  • 4 replies
  • 1974 views

I am trying to hide Tab in dialog based on checkbox value.

Able to hide and show on change event of checkbox value.

But unable to hide it when we open dialog.

 

To hide Tab, I am doing like below 

$(".coral3-Tab[aria-controls=' "+$("#customId").closest(".coral3-Panel").attr("id")+" ']").hide();

 

Tried with dialog-ready event, but getting undefined. 

Could someone please suggest on any other approach?

Thanks in Advance.

 

 

 

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 praveenk9057427

I am able to fix it. Thank you @kishore_kumar_  and @asutosh_jena_ .

The order of events I observed when loading dialog are like

"dialog-loaded"

"dialog-ready"

Normally - on dialog ready event we are able to show or hide individual fields. But if we want to hide a Tab based we need to get Tab id. That tab coral Id's are not available even on dialog-ready.

so I added Coral.commons.ready(function() {} );  and added based on checkbox value hide/show Tab id logic. Inside in coral ready function , am able to get the Tab id.

 

Thanks.

4 replies

Kishore_Kumar_
Kishore_Kumar_
Level 9
August 25, 2021

Hi @praveenk9057427 ,

 

Can you please refer the below document and try. It has detailed explanation steps for hiding tabs on page load and hide/show tabs on change event.

https://www.albinsblog.com/2019/02/how-to-hideshow-tabs-in-coral-3-ui-dialogs-aem.html#.YSYamo4zbIU 

    Asutosh_Jena_
    Community Advisor
    Asutosh_Jena_Community Advisor
    Community Advisor
    August 25, 2021

    Hi @praveenk9057427 

     

    Did you try with "dialog-loaded" event?

     

    Similar discussion here:

    https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/tab-hide-not-working-in-dialog-ready-but-its-working-in-onchange/td-p/383139

     

    Thanks!

      praveenk9057427
      praveenk9057427AuthorAccepted solution
      Level 2
      August 25, 2021

      I am able to fix it. Thank you @kishore_kumar_  and @asutosh_jena_ .

      The order of events I observed when loading dialog are like

      "dialog-loaded"

      "dialog-ready"

      Normally - on dialog ready event we are able to show or hide individual fields. But if we want to hide a Tab based we need to get Tab id. That tab coral Id's are not available even on dialog-ready.

      so I added Coral.commons.ready(function() {} );  and added based on checkbox value hide/show Tab id logic. Inside in coral ready function , am able to get the Tab id.

       

      Thanks.

        A
        Anoop345
        Level 2
        June 16, 2023

        Hi @praveenk9057427 ,

        could you please help me with the solution, I am having same requirement .

        L
        laxmipriya-1
        November 4, 2022

        Hi @praveenk9057427, Can you please share the complete js for the same?

        Terms & ConditionsAccessibility statement

        Loading footer...