Skip to main content

Switch (ALPHA)

BusinessEnterprise
Alpha feature: invite only

Responsive Widgets are in alpha and available by invitation only on Business and Enterprise plans. Behavior and properties may change. To request access, open a support ticket and name the feature Responsive Widgets (ALPHA).

The Switch widget shows one toggle with a label. Users turn it on or off. Use it for settings that take effect right away, for example "Show archived items."

Switch widget in a Responsive app
Switch widget

Widget type: WDS_SWITCH_WIDGET

Content properties​

These properties appear in the Content tab of the property pane.

Label​

Text string​

Sets the label shown next to the switch. Default: Label.

Position string​

Sets where the label appears. You cannot bind this property. Options:

  • Start: the label appears before the switch.
  • End: the label appears after the switch.

Default: Start.

General​

Default state boolean​

Sets whether the switch is on when the widget loads. If you change this value, the widget's state updates to match. Default: on.

Visible boolean​

Controls whether the widget is visible when the app runs. Default: on.

Disabled boolean​

Stops users from turning the switch on or off. Default: off.

Animate loading boolean​

Shows a loading animation while the widget's data loads. Default: on.

Reference properties​

Reference properties let you read the widget's state in bindings and code, for example {{Switch1.isVisible}}. You cannot set them directly.

isVisible boolean​

Shows whether the widget is visible.

Example:

{{Switch1.isVisible}}

isSwitchedOn boolean​

Shows whether the switch is on.

Example:

{{Switch1.isSwitchedOn}}

isDisabled boolean​

Shows whether the widget is disabled.

Example:

{{Switch1.isDisabled}}

Methods​

Methods let you change the widget's properties from code, for example in a JS Object.

setVisibility (param: boolean): Promise​

Shows or hides the widget.

Example:

Switch1.setVisibility(true)

setDisabled (param: boolean): Promise​

Turns the disabled state on or off.

Example:

Switch1.setDisabled(false)

setRequired (param: boolean): Promise​

Sets the widget's isRequired property. The Switch widget has no Required setting in the property pane.

Example:

Switch1.setRequired(true)

setValue (param: boolean): Promise​

Turns the switch on or off.

Example:

Switch1.setValue(false)

Events​

onChange​

Runs when the user turns the switch on or off.