Rules are the constraints and checks that you want to apply to the different controls of the Input form. But then are the Rules and validations the same? They are similar but then their implementation differs to a certain extent. While Validations are used to ensure valid data input before you submit your input form, Rules are used to restrict the state of some of the controls or buttons for the form depending upon the rule applied even before you submit the form.
Let us have a quick look at this video to understand how to add Rules to the controls.
Let us take an example of the Product details form that we have used earlier. It will have Product Name, Description, Delivery date, Category, List of essential items, and List of non-essential items, Quantity, and Submit button. You may want to restrict the users from submitting the form if certain columns like Product name and Quantity are not valid. In this case, say for example in case of an invalid product name, we would like to Hide the Submit Button or show the list of essentials / non-essentials according to the category selected. With Rules you can add these actions to your form to hide the button, to hide or show the lists if the conditions are satisfied. However, this change of state or display options is not possible with the Validations.
To add the Rules, you need to select the Rules option from the sidebar menu of your app. Here you can see Rules and Validation tabs. Select the Rules tab. Rules are applied at the control level. You need to make sure that you choose the correct screen that you want to apply the rules. Once you select the screen, you can assign as many conditions as you want to the different fields.
To add a new Rule, click the Add New Rule button. The Rules are set as conditions. Assign a name to the Rule. You can now define the IF condition for the field and provide the action to be taken if the condition is True and the action to be taken if the condition is False. You can use the option “Add reverse of true” to quickly define the exact reverse action if the condition is false.
Let us now add Rules to the controls of our Product details form. Let us consider a similar scenario as we have used for validations. We want to set the Rule to ensure that users add Mfg as a part of the product name. We would hide the Submit button if the user does not enter Mfg anywhere in the name.
We also want to ensure that quantity is not less than or equal to 5 as well as not more than 50 units. You can see the rules we have applied to the two controls in the illustration below.
Let us understand the operations available for a few of the common controls:
Text type controls
The operators available for all those controls with Text data type including those for the dropdown (single select), radio buttons will be similar to that for text and text area controls. You can assign a rule to check the defined values or the data from a field.
The Operators will be Equal to, Not Equal to, Start with, Not Start with, End with, Not end with, Contains, Not Contains, Regular expression, Is empty, Is not empty.
- Contains operator checks if the input value contains the specified characters or strings. For example, if a Product code should contain “Mfg”, then we will define it as Contains > Value > [“Mfg”].
- Regular expression: This operator is used to specify a sequence of characters to define a pattern. For example: To set a constraint that the username must contain only letter, number and underscores, the pattern will be defined as Regular Expression > Value >^[A-Za-z0-9_]*$
Number type controls
The operators for the number type controls will be related to numeric operations like value greater than, equal to, less than, and so on. You can assign a rule to check the defined values or the data from a field.
The Operators will be Equal to, Not Equal to, Less than, Greater than, Less than or equal to, Greater than or equal to, Regular expression, Is empty, Is not empty.
Date time picker
The date-time picker will have a rule for comparing the dates and times like date-time equal to, before a given date, after a given date, and so on.
The Operators will be Equal to, Not Equal to, Before, Before or equal, After, After or equal, Regular expression, Is empty, Is not empty.
- Before, Before or equal, After, After or equal are operations to validate dates before or after the specified date. For example, to validate that the delivery date or date of expiry is not less than today’s date.
Typically checkbox, dropdown lists (multi-select), will have an array of data. They will thus have a list data type and will have rules for comparing the selected values with a certain set of characters or values from fields.
The Operators will be Minimum select, Maximum select, Exact select, Contains, Not contains, Regular expression, Is empty, Is not empty, Contains any, Not contains any, Contains all, Not contains all.
- Minimum select and Maximum select: This operation defines the minimum and maximum number of list items to be selected. For example, if Minimum select = 2, it means that you would have to select at least 2 of the options from the list.
- Exact select: This operation defines the exact number of items to be selected from the list. For example, if you set Exact select = 2, then if you select 1 item or even 3 or more items it will throw an error message.
- Contains and Not Contains: This operation specifies that the selected items should contain or not contain the specified string or field. For example, from the List of essentials select at least Groceries along with other multiple options of user’s choice. Contains > Value > [“Groceries”]. The Not Contains will be the exact opposite of this operation.
- Contains any: This operation specifies that the selected items should contain any of the specified items. For example, we may want to specify that the selected items should contain either or any of the values out of Groceries and Vegetables along with other multiple options selected. The operation would be specified as Contains any > Value > [“Groceries”, “Vegetables”].
- Contains all: This operation specifies that the selected items should contain all of the items mentioned in the rule. For example, we may want to specify that the selected items should contain both Groceries and Fruits along with other multiple options selected. The operation will be specified as Contains all > Value > [“Groceries”, “Fruits”].
The Toggle control would return the values as boolean. Thus the rule will be based on comparing whether the value returned is 0 (false) or 1(true).
Following are the operators for the toggle control:
- Equal to and Not Equal to.
- For example, let us consider that the user selects whether the current product will have factory gate delivery. If the user selects ‘ True ’ on the toggle control, delivery will be done, else if the toggle returns False it will show a message that the “Item will not have factory gate delivery”.
Now let us take another example where you want to choose the Category (which is radio control in the example) and has Essentials and Non-essentials as options. If you choose Essentials then the list of Essentials would be displayed and if you select Non-essentials, then the list of Non-essentials would be displayed. The operators available for the radio button controls will be the same as those for the text data type. In this case, let us use the operator “Equal to”. The illustration below shows the rules applied to Category control.
Now let us take a preview of our form and check the rules that we have applied for different fields.
If you are applying the validations and rules together you can also add the error messages for the invalid inputs.
Rules can thus be used for ensuring that if users enter invalid data then you set a certain state for the form objects. It will not be restricted to the submit button, we can assign the state of other text controls, numeric controls, toggle control, dropdown list, and so on.