Web Conditionals allow you to display/hide and define mandatory fields based on actions taken by a user on a website. They are similar to App Conditionals that are available on Limelight.
The parts are as follows:
- Trigger Field
- Function/Operator
- Value
Expression Types:
- Hidden
- Mandatory
Conditional Functions
1. Trigger Field Type | 2. Function/Operator | 3. Value |
Text/Text Area |
Is Blank
Contains |
(enter value |
Single Checkbox |
Contains
Equals/Does Not Equal |
(enter value)
True/False |
Multi Checkbox |
Is Blank
Equals Does Not Equal |
(select option) (select option) |
Dropdown |
Is Blank
Equals Does Not Equal |
(select option) (select option) |
Radio Button |
Is Blank
Equals Does Not Equal |
(select option) (select option) |
Date |
Is After
Is Before |
(select option)
(select option) |
Guests | Greater Than | N |
Guests | Greater Than | Number |
Target Field Properties
Target Field Type | Property | Property value type |
All | Hidden | True/False |
All | Mandatory (will override default mandatory setting) | True/False |
How to Implement Conditionals
For this example, we will display or hide the home and mobile phone fields based on the phone type the user has selected.
To add a conditional, navigate to the form field listed in the left side editor panel. Select the form field you want to set your condition on. In this case, select Home.
The form field settings will open within the editor panel. Scroll to the bottom of the field settings and click + Add Conditional.
For the Home phone field, we need 3 conditionals set up:
1. Home phone must be hidden if nothing is selected in Phone Type
- Select the following options from the dropdown menus:
If phoneType > Is Blank
Then Hidden - Make sure the checkbox next to Hidden is checked off.
2.
Home phone must be a mandatory field once displayed
- Select the following options from the dropdown menus:
If phoneType > Equals > Home
Then Mandatory - Make sure the checkbox next to the Mandatory is checked off.
3. Cell phone must be hidden if Home phone is selected
- Select the following options from the dropdown menus:
If phoneType > Equals > Cell
Then Hidden - Make sure the checkbox next to the Hidden is checked off.
Repeat the process by adding the same conditions to the Cell Phone form field and updating the Value field accordingly.
After completing the conditionals, Save and Publish your website.
Testing Web Conditionals
1. Go to the website URL and test your conditionals. For this case, when you load the page, both the Home Phone and Cell Phone form fields are visible and the Phone Type is mandatory.
2. The conditional will trigger once a user selects an option from the Phone Type field. When Cell is selected, the Cell Phone field will become mandatory and the Home Phone field will disappear. The opposite applies when Home Phone is selected.