Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

AEM 6.3 How to show/hide tabs in a component based on the dropdown

Avatar

Level 4

I'm trying to show/hide add tabs as per the number i select in the drop down

PFA image for the dialog. If i select 2 from the sub Menu Style , only column1 and column 2 should be visible.

I tried some approach from

Home · aman02deep/aem-6.2 Wiki · GitHub

aem-6.2/tabshideshow.js at master · aman02deep/aem-6.2 · GitHub but they aren't working for me

It would be helpful if you provide me the same functionality with checkbox alongside drop down selection

TIA

1536079_pastedImage_0.png

1 Accepted Solution

Avatar

Correct answer by
Level 1

Since release 3.19.0, ACS AEM Commons provides the functionality to show/hide dialog fields and tabs using dropdown selection or checkbox selection or the combination of both. Moreover, a required field validator is also available which applies validation only when the field is visible.

ACS AEM Commons: Show/Hide dialog fields/tabs with dropdown, checkbox or the combination of both

View solution in original post

4 Replies

Avatar

Correct answer by
Level 1

Since release 3.19.0, ACS AEM Commons provides the functionality to show/hide dialog fields and tabs using dropdown selection or checkbox selection or the combination of both. Moreover, a required field validator is also available which applies validation only when the field is visible.

ACS AEM Commons: Show/Hide dialog fields/tabs with dropdown, checkbox or the combination of both

Avatar

Level 1

When we drag a tab component, I want tab 1 and tab 2 to appear, but I also want a picture that the author can move to appear by default instead of tab 1 text. Is that possible?

Avatar

Community Advisor

Hi,

For checkbox you can use same code except binding on select event, you need to call your code to show hide on change event.

e.g.

$(".checkbox").change(function() {

    if(this.checked) {

        //Do stuff

    }

});



Arun Patidar

Avatar

Level 1

Hi @CT1012, If you have found the solution for this. Can you please share.