Binding Widget’s Value to Variable

As an application designer, you can bind some simple widgets' value to variables like script variables, model variables, tile variables (widget-level variables) and analytic application properties. In this way the values of such widgets can be updated automatically without writing any scripts.

Besides this, you also have the option to enable writing the value you set for a simple widget during application runtime back to a certain variable, and apply the variable wherever needed.

The simple widgets and variable types available for binding are:

  • Dropdown/ Checkbox Group/ Radio Button Group

    Their ID and description can be bound to script variables, model variables and tile variables

  • Input Field/ Text Area

    Their value can be bound to script variables, model variables, tile variables and analytic application properties.

    When the variables are array, the value displayed in an input field or text area will be separated by comma (",").

  • Slider/ Range Slider

    Slider’s current value and range slider’s start and end value can be bound to script variables, model variables and tile variables. The variables must be single value of number type.

  • Image

    It can be bound to a script variable. The variable must be single value of string type.

    Image only supports such binding when dynamic setting image URL is enabled.

Tip

The analytic application properties include current user/time/date, last modified date or time, last modifier and creator.

Tip

In general, if not specified, the variables available for binding are primitive type variables (string, boolean, integer or number) and can be array or single value.

Note

Push/pop/index of array in scripting won’t be reflected in the bound widget.

Example 1: Synchronizing Slider’s Current Value with a Chart’s Variable

Say you want to synchronize a slider’s current value (Slider_1) with one variable of Chart_1 named as Variable_1.

  1. Go to the Builder panel of Slider_1.

  2. In Current Value, choose Variable_1 from the drop down list.

  3. Run this analytic application.

  4. In application runtime, click the button (Edit Chart Prompts) in Chart_1 and adjust the value of Variable_1.

    Slider_1's value will be changed accordingly.

Example 2: Applying Slider’s Runtime Value as the Threshold of a Chart’s Conditional Formatting

Say you want to apply a slider’s current value (Slider_1) that end users set during application runtime as the threshold of Chart_1’s conditional formatting.

  1. Created a variable named Variable_2.

  2. Go to the Builder panel of Slider_1.

  3. In Slider Property, enable the option Enable the write-back in runtime.

  4. From Write current value back to the variable field, choose Variable_2.

    Note

    We recommend you align the type of slider’s current value and the write-back script variable, as there is no conversion of different variable type.

  5. Go to the Builder panel of Chart_1, click the button (Threshold option) beside the measure you want to apply conditional formatting to, and choose View Thresholds…

  6. Click the Edit button of this threshold, in Comparison Measure, choose Variable_2.

    Step result: Current value is automatically written back to such variable applied to the chart’s conditional formatting. The threshold of Chart_1 will always take the current value of Slider_1.

    Caution

    If end user changes such widget’s value directly or via API and meanwhile, as an application designer, you’ve defined a variable bound to this widget’s value as in example 1, the variable binding will become invalid and widget value will be reset back to Manual Input.

After this, please don't use this write-back variable Variable_2 in scripting, otherwise value of this variable may not be up to date.

Related Information