Applies to version 2017.1.x; Author: Tomasz Pytlak
While creating a business workflow usually we want the user to be aware of what values they input into specific fields. Exceeding a certain amount of money or choosing a past date are actions that the user in the context of specific processes should sometimes not undertake. However, if we want to allow this sort of action but also make the user notices that they are exceeding the range, it is a good idea to use form rules to change the font format and background color. It also helps the user notice input mistakes while filling in the form.
Process and concept:
For this article, a workflow named “Order” is created and it has following fields:
- Author (User or group)
- Date (Date and time)
- Order value (Floating point number)
- Order (Items list)
- Item (Single line of text)
- Value (Floating point number)
Value summary from the item list is copied to the Order value field
If the user exceeds the limit of 10 000 PLN, font size in Order value field will increase threefold and the background will turn red.
Invoking this configuration requires three steps:
2. Creating form rule in Configuration -> Form rules node.
You can compare building a form rule to putting together a matryoshka doll. You build them by dragging&dropping or filling in functions inside other functions. All the methods used to change the formatting can be found in “Styling” node. Besides them, you also need: a conditional choice (IF THEN), a ‘greater than’ comparison, and ‘Order value’ form field variable.
Pic 3. Rule editing
Pic 4. Completed form rule “exceeding order value”
The created form rule can be described in the following way:
- If order value > 10 000 then
- Set background color of Value order form field to red
- Set color of field text Value order to red
- Increase form field font size to 300%
- In other cases (value <=10 000 or null)
- Clear background formatting of Value order form field
- Change color of field text Value order to yellow
- Clear font formatting of Value order form field
3. Invoking the form rule
Once defined, the form rules can be used in many places, i.e. when loading the page, on postback, or when changing the form field value. In our scenario, we will tie the form rule to the Order value field – the form rule will be executed when the value of the Order value field is changed.
In the Order value field configuration, go to the Style and behavior tab, and enter the configured form rule into the ‘Rule invoked on value change’ area.
Pic 5. Form rules used on value change
After proceeding through all the mentioned steps and exceeding the limit, the form will look as below.
Pic 6. Form when the entered value exceeds a certain amount