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

Adobe Summit 2023 [19th to 23rd March, Las Vegas and Virtual] | Complete AEM Session & Lab list
SOLVED

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

Avatar

Level 2

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.

 

 

 

1 Accepted Solution

Avatar

Correct answer by
Level 2

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.

View solution in original post

4 Replies

Avatar

Community Advisor

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 

Avatar

Correct answer by
Level 2

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.

The ultimate experience is back.

Join us in Vegas to build skills, learn from the world's top brands, and be inspired.

Register Now