question Toggling the Visibility of a Repeater Component in UI Builder Using a Button in ServiceNow Studio forum

Toggling the Visibility of a Repeater Component in UI Builder Using a Button

rt_kaneko — Wed, 04 Dec 2024 08:56:18 GMT

Currently, I am trying to implement a feature in UI Builder that allows toggling the visibility of a specific Repeater component using a button.

Specifically, I want to achieve the following requirements:

When the button is clicked, the Repeater component is hidden.
Clicking the button again makes the Repeater component visible (toggle between visible and hidden states).

Steps I have tried so far:

I bound the Repeater’s Component Visibility to a Client State Parameter (isVisible1), configuring it so that the Repeater is hidden when the value is True and visible when the value is False.
I set an Update client state parameter event for the button and wrote the following script to toggle the value:

function evaluateEvent({api, event}) { return { propName: "isVisible1", value: !api.getState("isVisible1") }; }

Current Situation:

The Repeater component is successfully hidden on the first button click (even without applying the above script).
However, I cannot make it visible again with subsequent clicks.
I suspect that the above script is not appropriate for this use case.

What I would like to know:

If there are any mistakes or missing steps in the above implementation, what should I fix?
Is there a way to achieve this visibility toggle functionality using the standard features of UI Builder?