Expandable
See also: Collapse, Expand, Expanded/Collapsed
An element container of the 'Expandable' type is used to show or hide extended input options or optional details as required.
As the tree view for a form containing only one 'Expandable' shows, this contains two child element containers (a Column layout and a Row layout).
Configuration:
When newly added to the input form, an Expandable container shows only the Column layout container for the elements that should be visible even when Expandable is collapsed (if set as 'visible').
By clicking on the [+] 'Expand' button, the Row layout container used for inserting elements is displayed below, which is never seen only in the expanded state (provided they are set as 'visible').
►NOTE◄
The initial state (collapsed or expanded) is saved in the form design and taken into account accordingly when the form is opened. When loading form data, the state changed by the user is retained. This state can only be changed interactively.
Tip: The actions Collapse and Expand, together with the behaviour triggers Expanded/Collapsed, can also be used to work programmatically with the state of the container.
Even in the collapsed state, the elements contained in the container are validated. If required fields are included or validators are configured, sometimes validation errors are reported when saving a shipment without the cause being immediately apparent. This should be taken into account when designing forms, e.g. by activating the 'Inherit required' property of the container. Then the user can recognize whether required fields are contained, even when the form is collapsed.
Use case example
Collapsed:
Expanded: