Using a button/text to toggle visibility of a widget?

Hi there. New to this, so bare with me.

I’m looking for a way to toggle visibility of a widget without using a checkbox or switch. Ideally, I’d click on text or a button and a widget would appear.

For example, clicking Contact Information once would cause the below form to appear. Clicking it again would cause it to disappear. If unable to do this with text, I would be alright with doing a button or an icon button.

Is this possible? I’ve been digging for quite some time along with my colleague who knows much more Javascript than I do and not making much ground.

Thanks!

Hello Michelle and welcome to our community! You can achieve this by using the storeValue() method.
Please fork this sample app that demonstrates how to show/hide a widget at the click of a button.

Hi, thanks for the info! I’m having to reply from another account as I can’t seem to get back into the one I initially posted this from. Is there a way to have a singular button toggle visibility? So as opposed to having a show and a hide button, just having one button that toggles each. Click once, show. Click another time, hide.

TIA

Yes, this is possible using the storeValue() method. Here is an example of how you could implement it:


Amelia, that’s awesome, thank you! One last question (hopefully), is there a way to dynamically change the appearance of the button (or fake it) based on whether the button is clicked or not? For example, the widget is hidden, the button says “Show”. You click “Show”, the widget is visible, and the button now says “Hide”. An alternative would be having an image that changes to another image.

Sure, you can change the label dynamically like this:


Similarly, you can change the styling, e.g., color or icon.

Amelia, this worked fabulously. Thank you so much!

Hi @Amelia How can I do this with an Input Field and a Select?

If I write something to the Input field the dropdwon should be Disabled or unvisible. Clicking one element from the Dropdown should make the Input field disabled or unvisible.