Configuring interfaces and writing scripts requires the use of context variables. Variables determine specific values in widgets, for example, in counters. They are also used to design the layout of fields, show or hide page components, etc.
There are two types of context that have major differences: widget context and app context.
Widget context
Widget context comprises service variables used to configure the widget. They are used in scripts that determine the widget’s behavior. They also allow fetching data from apps, loading files, etc.
To add a widget context variable, go to the Context tab of the interface designer.
Click +Add and create the variable of the type you require. Read more about the types of variables available in the system in System data types.
You can only use English letters to set property names. We also recommend using meaningful names that are easy to understand: for example, Username instead of Var123.
Note that variable settings include the Show only when a condition is met option.
It allows you to set the conditions under which this field will be displayed in the widget. In other cases, the field will be hidden. This allows you to set up a widget that adapts to users’ actions. For example, an additional field may appear only if an employee selects Yes in a Yes/No switch.
The variables created on the Context tab are also displayed on the right-side panel of the designer, on the Properties tab. This tab also features the system widget variables.
In a custom widget, the context includes additional options for flexible configuration. You can specify the input and output variables or edit the widget settings window. Read more about it in Additional options in the context of custom widgets.
Example of using widget variables
Let’s say you want to add a column with payment instructions to the order form. These instructions have to be shown only if the sales rep selects Full payment as payment type when creating a new order.
In the interface designer, on the Context tab, create a Yes/No switch variable. This variable allows users to select one of two options. You can customize their names. In our case, let’s use Advanced payment and Full payment instead of Yes and No.
Next, go to the Template tab and place the variable on the page so that users are able to select one of the payment options when creating a new order.
Add the Column widget to the form. In its settings, click the 
icon next to the Hide field. Then click the <Not defined> link and select the Payment type variable created earlier. Publish the widget to apply the changes.
Now, when a user selects the Full payment option as payment method, the hidden column with the order processing instructions will appear.
You can use the same variable in a script, for example, with the On mouse enter handler of the Button widget. Then the tab will appear the moment the user hovers the cursor over the button. Read more about it in Scripts in widgets.
App context
App context contains app fields that users fill out and view when they work with app items. For example, fields for the client’s last name, order amount, file, etc.
You can configure app properties in the standard mode or advanced mode and in the interface designer.
In the interface designer, app properties are located on the right-side panel on the Properties tab. You can drag them to the canvas and place in the appropriate order.
Read more about form properties in Context tab.
To learn more about setting up forms in the interface designer, see Form templates.
Found a typo? Highlight the text, press ctrl + enter and notify us