Variant

Allows users to represent multiple views, such as Plain text, Masked text, Single select, Date, Decimal, Integer. Because Variant represents multiple views, binding each view to their own variable is not necessary.

Configuration properties

Under Configuration, set or modify the behavior properties for the view.

The behavior configuration properties for Variant are shown in the following table:
Table 1. Behavior configuration properties for Variant
Behavior configuration property Description Data type
Auto select control The control used is automatically selected, based on the data binding type. Use Auto select only when the Initial control index is not provided. If there is a value specified for the Initial control index, auto select is ignored, even if it is enabled. Boolean
Initial control index Determines the initial control to display. This expression returns a 0-based index that corresponds to the control that is shown by default. For example, if the control index is 0, the control in the first tab is shown . If the control index is 1, then the second tab is shown. String

Events

Set or modify the event handlers for the view in the Events properties. You can set events to be triggered programmatically or when a user interacts with the view. For information about how to define and code events, see User-defined events.
Variant has the following types of event handlers:
  • On load: Activated when the Variant control is loaded, for example

    me.reset()

  • On change: Activated when a change is detected., for example

    console.log(me.getValue())

Methods

For detailed information about the available methods for Variant, see the Variant JavaScript API.

Additional resources

For information about how to create a coach or page, see Building coaches.
For information about standard properties (General, Configuration, Positioning, Visibility, and HTML Attributes), see View properties.