Collapsible Area Action
Last updated
Last updated
Collapsible Area Action is a regular block that allows you trigger the expansion or collapse of a Collapsible Area element on the page or form.
Refer to the Collapsible Area Action in Data Design block for dynamically generated content.
The block comes in two modes which are discussed below.
The Mode 1 version of the Collapsible Area Action block consists of (from left to right):
Action: Dropdown configuration setting that allows you to choose from three options:
Expand: Expands the element.
Collapse: Collapses the element.
Toggle: Toggles the state of the element i.e. collapses it if it is expanded and vice-versa.
Element: Selectable Input to choose the Collapsible Area element.
The Mode 2 version of the Collapsible Area Action block consists of (from left to right):
Action: Dropdown configuration setting that allows you to choose from three options:
Expand: Expands the element.
Collapse: Collapses the element.
Toggle: Toggles the state of the element i.e. collapses it if it is expanded and vice-versa.
Element: Value Parameter that accepts either a text value in the form of a CSS Selector or an element value. The Element block comes pre-attached for your convenience but can be removed and customized.
The image below shows an example of the Mode 1 version where the selected Collapsible Area element is expanded.
In the next example we see a Mode 2 version where the Element value parameter is attached to a Text block containing a CSS Selector that selects the same element. This time the element's state is toggled.
NOTE: Using a CSS selector, you can operate on multiple elements that match the criteria specified by the selector. See the references below for more information:
