Expand my Community achievements bar.

SOLVED

Show and Hide textfield/button using Checkbox

Avatar

Level 5

Hi all, 

I have created dialog with some text fields. And I have added a button(CTA) i need to add one checkbox if that checkbox clicked then that button should disappear from page. 

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

You can add one checkbox in dialog and on selection of it you can show/hide the button in Sightly.

 

Dialog 

"items": {
"jcr:primaryType": "nt:unstructured",
"showbutton": {
"jcr:primaryType": "nt:unstructured",
"name": "./selected",
"text": "Show Button",
"value": "true",
"sling:resourceType": "granite/ui/components/coral/foundation/form/checkbox",
"renderReadOnly": true
}

Sightly

<sly data-sly-test.selected="${properties.selected}">
	<button type="button">Click Me!</button>
</sly>

You can also refer Hide in Navigation checkbox of page in CRXDE : /libs/wcm/foundation/components/basicpage/v1/basicpage/tabs/basic/items/column/items/title/items/hideinnav

 

View solution in original post

1 Reply

Avatar

Correct answer by
Community Advisor

You can add one checkbox in dialog and on selection of it you can show/hide the button in Sightly.

 

Dialog 

"items": {
"jcr:primaryType": "nt:unstructured",
"showbutton": {
"jcr:primaryType": "nt:unstructured",
"name": "./selected",
"text": "Show Button",
"value": "true",
"sling:resourceType": "granite/ui/components/coral/foundation/form/checkbox",
"renderReadOnly": true
}

Sightly

<sly data-sly-test.selected="${properties.selected}">
	<button type="button">Click Me!</button>
</sly>

You can also refer Hide in Navigation checkbox of page in CRXDE : /libs/wcm/foundation/components/basicpage/v1/basicpage/tabs/basic/items/column/items/title/items/hideinnav