Show hide field based on checkbox | Community
Skip to main content
Level 2
August 30, 2023
Solved

Show hide field based on checkbox

  • August 30, 2023
  • 2 replies
  • 2174 views

Hi, as the title suggests I'm trying to make one of my fields/container hide when checkbox is true/checked & using ACS commons for this purpose.

Even after following each step the show-hide checkbox functionality isn't working for me. I'm attaching the screen shots of my fields here. Please tell me what am I missing or if changes are required.

I want to hide checkbox-container which contains one text field based on classbox (its my check box).
Component tree:

 

check-box properties:

----------

 

container properties:

----

Its most likely there's mistake from my side but I couldn't figure it.
I request for you guidance.

Thanks,
ssin93

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 sherinregi-1

Hi @ssin93 

Can you try  updating the checkbox container granite class property to mycheckbox-showhide-target(remove the ".").

See if it helps

2 replies

Mahedi_Sabuj
Community Advisor
Community Advisor
August 30, 2023

Hi @ssin93,

The checkbox show/hide functionality does not support boolean values. You might consider to use string values for the checkbox's checked (and unchecked) status. Also, remember to set the value "cq-dialog-checkbox-showhide" for the "granite:class" attribute. 

 

<customClass jcr:primaryType="nt:unstructured" granite:class="cq-dialog-checkbox-showhide" <!-- Add --> sling:resourceType="granite/ui/components/coral/foundation/form/checkbox" name="./customClass" text="Add Custom Class?" value="enable"/> <!-- Update -->

 

Mahedi Sabuj
ssin93Author
Level 2
August 30, 2023

Hi @mahedi_sabuj,
Thanks for your prompt reply. I tried the changes which you suggested but no success.
As @sherinregi-1 suggested, it was single (.) causing the issue. After removing it, field was working as expected. But next problem is in multifield. 
When I add these fields in multifield, the single checkbox is affecting all the fields to show/hide. Tried this but didn't worked.
Thanks again

sherinregi-1
Community Advisor
sherinregi-1Community AdvisorAccepted solution
Community Advisor
August 30, 2023

Hi @ssin93 

Can you try  updating the checkbox container granite class property to mycheckbox-showhide-target(remove the ".").

See if it helps

ssin93Author
Level 2
August 30, 2023

Hi @sherinregi-1 ,
Thanks for your prompt reply. I tried the changes suggested by you & it worked.
But next problem is in multifield. 
When I add these fields in multifield, the single checkbox is affecting all the fields to show/hide. Tried this but didn't worked.
Thanks again