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

CheckBox_Core_Component

imadullakhan
Level 3
Level 3

Hi @everyone

 

can anyone help me to do this core component"

when I select the checkbox, a new text field show is displayed. If the checkbox is unchecked, the text field should be hidden"
1 Accepted Solution
Anudeep_Garnepudi
Correct answer by
Community Advisor
Community Advisor

@imadullakhan 

Create a custom listener file and add below code and update field names.

 

 

jQuery(document).on("dialog-ready", function() {
    $(document).on("change", "[name='./checkbox-name']", function(e) {
        if($(this).prop("checked")) {
            // Logic Checked
            $("input[name='./inputbox-name']").closest(".coral-Form-fieldwrapper").show();
        } else {
            // Logic un checked
            $("input[name='./inputbox-name']").closest(".coral-Form-fieldwrapper").hide();
        }
    });
});

 

Check out below post for more details.

https://adapttoaem.blogspot.com/2021/02/aem-hideshow-touch-ui-dialog-fields.html

 

 

View solution in original post

1 Reply
Anudeep_Garnepudi
Correct answer by
Community Advisor
Community Advisor

@imadullakhan 

Create a custom listener file and add below code and update field names.

 

 

jQuery(document).on("dialog-ready", function() {
    $(document).on("change", "[name='./checkbox-name']", function(e) {
        if($(this).prop("checked")) {
            // Logic Checked
            $("input[name='./inputbox-name']").closest(".coral-Form-fieldwrapper").show();
        } else {
            // Logic un checked
            $("input[name='./inputbox-name']").closest(".coral-Form-fieldwrapper").hide();
        }
    });
});

 

Check out below post for more details.

https://adapttoaem.blogspot.com/2021/02/aem-hideshow-touch-ui-dialog-fields.html

 

 

View solution in original post