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

SOLVED

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

CT1012
Level 4
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
m_naveed
Correct answer by
Level 1
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

2 Replies
m_naveed
Correct answer by
Level 1
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

Arun_Patidar
Community Advisor
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

    }

});