Enable element

See also: Disable element, Form elements

Aktionen - Kurzfassung

The Enable element action sets the 'Active' option for the linked Target element at runtime.

The Enable element action sets the 'Active' option for the linked Target element at runtime. This option must be set for an element to be effectively enabled (see note below). An element for which the 'Active' option is not set is always effectively disabled. It does not accept any interactions (accept focus, change value, etc.) and is considered 'valid' without checks (required field, Validators). In general, an effectively disabled element also visually signals this state by appearing 'greyed out'.

images/download/attachments/189432720/image-2024-10-7_10-12-37-version-1-modificationdate-1728288757152-api-v2.png

  • The action can only be selected under Action type if a Target element is linked.

  • The 'Active' option is available for all Form elements.

►NOTE◄

  • The Target element is only effectively enabled at runtime by the Enable element action if all of the parent Element containers in the form design is also 'set to enabled'.

  • If a Target element of the type Element containers is effectively enabled, then all child elements that were previously 'set to enabled' (latently active) are also effectively enabled.

  • The effective access to an effectively enabled element can be restricted by settings for further options ('read-only', 'visible' – see Form elements) for the same or a parent element.

Example

In a form, information on a Mail address (postal address) should only be able to be provided in stages as the level of detail increases.

  • In the first stage, information on Zip code and Place must be entered.

  • The second stage with the fields Street and Street no. should only be enabled if valid data has been entered in the first stage.

Runtime example:

Level

View

Description

Details 1

Fill out

images/download/attachments/189432720/image2020-6-17_18-36-6-version-1-modificationdate-1728288633170-api-v2.png

  • The Details 1 area is enabled, allowing entries.

  • The Details 2 area is still disabled ('greyed out'), as the required field Place is still empty.

Details 2

Fill out

images/download/attachments/189432720/image2020-6-17_18-36-56-version-1-modificationdate-1728288633172-api-v2.png

  • The Details 1 area is validly filled.

  • The Details 2 area is therefore now enabled and can be edited.

►NOTE◄ Further steps are conceivable according to the same scheme, but will not be discussed here. In practice, the gradual collection of detailed data often involves more extensive content than in this example. In this case, the Tab panel element offers the possibility to arrange the respective Element containers in a way that saves space. Even then the individual stages can be enabled as described here in a step-by-step manner.

Configuration:

images/download/attachments/189432720/image2020-6-17_18-41-1-version-1-modificationdate-1728288633181-api-v2.png

  • The overview in the Form designer displays the hierarchical structure within the Mail address on the left, with one Row layout (Element containers) each for the levels Details 1 and Details 2.

  • In the layout, the Row layout Details 2 is selected, so that its properties appear on the right. The Active option is not set in the form design.

  • What is not visible in the image: The Active option for the Text field elements 'Street' and 'Street no.' are set. These elements are therefore latently active, but effectively appear disabled because the parent Row layout is disabled.

images/download/attachments/189432720/image-2024-11-5_15-41-22-version-1-modificationdate-1730817681258-api-v2.png

For the Row layout 'Details 1', the behaviour displayed on the left is configured, which does not use its own Triggering event, because it is called by other behaviours (see below):

  • The Behaviour type Validate element refers by link to the executing element (Row layout 'Details 1'). The Actions on 'true' are only executed if all active elements contained in this container are validly filled. In the example, both fields ('Zip code', 'Place') are defined as required fields. They must therefore not be empty. (see Form elements)

  • Under the Actions on 'true', the action Enable element is used to set the Row layout 'Details 2' to enabled, so that the contained elements ('Street', 'Street no.') can be edited.

  • Among the Actions on 'false', the action Disable element is used to set the Row layout 'Details 2' to disabled, if the information under 'Details 1' is not complete.
    ►NOTE◄ This action would be relevant, for example, if valid information on 'Zip code' and 'Place' is first entered and then removed either completely or partially. Whether it then makes more sense to delete existing entries for 'Street' and 'Street no.' or to display them as disabled should be considered.

images/download/attachments/189432720/image-2024-11-5_15-50-28-version-1-modificationdate-1730818227167-api-v2.png

The behaviour displayed on the left should be configured in this form for both elements in the Row layout 'Details 1', so that each time a key is pressed in one of the elements, the system checks whether the Row layout 'Details 2' should be enabled or not:

  • The Triggering event Changed should react to all Change types.

  • The Behaviour type Static with the default value 'true' (not in the image) ensures that the Actions on 'true' are executed unconditionally.

  • The actual check is triggered under the Actions on 'true' by calling the above described behaviour 'activationStreetNo' via Execute behaviour action with the Target element 'Details 1'.