Adding Conditions in the Builder

Conditions allow users to skip or reveal screens and fields in the normal workflow if certain user defined variables are met. 

Table of Contents

Conditional Fields

Conditional Screens

More than One Condition

Conditions

Conditions are If/Then statements that are configured in the Field Settings modal under the Conditions tab. When defining the condition for displaying a screen or field, the condition operates on the value of a field that has happened prior to the screen or field where the condition is being applied.

The condition can be based upon the alphanumeric value of the field or based upon whether a checkbox is checked or not.

Conditional Fields

Field Conditions affect individual fields at a time and must be configured on each field. Located under the Conditions tab on the Field Settings modal.

There are many examples of conditions in the wild, like when an online ordering form asks whether the Shipping Address is different than the Billing Address. If yes, than those fields are revealed to be completed. If no, those fields remain hidden and the user can continue the form.

1. Select the gear icon for the field that you wish to hide or reveal to open the Field Settings modal. In the example above, the first field that needs a condition would be the Shipping Street Address.
2. Toggle to the Conditions tab and select + Add Condition.
3. Expand the Field drop down where you will first answer the question, "What screen is the field in?"
4. Next, Choose the field that triggers the condition. In our example above, this could be a checkbox asking whether there is a different Shipping Address.
5. The Condition is the determining circumstance under which the field will be revealed or hidden. Refer to the checkbox vs. alphanumeric condition tabs above to choose the right condition based on the condition field.
6. The Value is the field value that will trigger the condition. Refer to the checkbox vs. alphanumeric condition tabs above to choose the right value based on the condition field.

So this example may look like the condition box below. A checkbox, located on the "Customer Information" screen, with the question "Is the Shipping Address different than the Billing Address?" is posed as the Condition Field. The Condition is "Equal" and the Value is "Checked" so that when the box is checked, the field is revealed. Select the Checkmark to save the condition and Done to close the modal.

The field will now have the branch icon to indicate that field is conditional. Now simply copy this field and rename it to copy the condition exactly, or repeat the above steps on all remaining Shipping Address fields.

Conditional Screens

When a form has multiple conditional fields that need to be triggered off one field value, a faster way to configure this scenario is to add all those fields to one screen and make that one screen conditional. That way, the mobile user will either reveal the screen or skip the screen entirely, saving time and reducing confusion as to which fields they need to complete or leave empty.

Screen Conditions are located on the Conditions tab on the Screen Settings modal.

Taking the example above, a much faster way to configure these fields would be to add them to their own screen and add the condition to the screen instead.

1. Select the gear icon for the screen that you wish to hide or reveal to open the Screen Settings modal.
2. Toggle to the Conditions tab and select + Add Condition.
3. Expand the Field drop down where you will first answer the question, "What screen is the field in?"
4. Next, Choose the Field that triggers the condition. In our example above, this could be a a single choice button asking whether there is a different Shipping Address with the choices "Yes" and "No."
5. The Condition is the determining circumstance under which the field will be revealed or hidden. Refer to the checkbox vs. alphanumeric condition tabs above to choose the right condition based on the condition field.
6. The Value is the field value that will trigger the condition. Refer to the checkbox vs. alphanumeric condition tabs above to choose the right value based on the condition field.

So this example may look like the condition box below. A single choice buttons field, located on the "Customer Information" screen, with the question "Is the Shipping Address different than the Billing Address?" is posed as the Condition Field. The Condition is "Equal" and the Value is "Yes" so that when the "Yes" button is selected, the screen will be revealed when the mobile user continues to the next screen.

The screen will now have the branch icon to indicate that entire screen is conditional.

More than One Condition

You can add multiple conditions to a single field or screen. These conditions are separated by "Or," if either field can trigger the condition, or "And," if both fields are needed to trigger the condition. For our example above, if the Shipping Address is actually a PO Box, there would be two conditions separated by "And" because only if the Shipping Address is different and it is a PO Box would the PO Box field be revealed. 

Let's take a look at an alternative example using demographic information. Perhaps a form has a section dedicated to retirees or clients over 60. Only those who are retired or are over 60 years of age need to complete a certain set of questions on a conditional screen. 

1. Select the gear icon for the screen that you wish to hide or reveal to open the Screen Settings modal.
2. Toggle to the Conditions tab and select + Add Condition.
3. Follow the steps above to add the first condition, selecting the Screen, Field, Condition, and Value based on a field indicating the person completing the form is a retiree.
4. Select + Add Condition and select the button with "And" to select "Or" from the drop down.
5. The second condition will be based on the person's age so we will be using the condition >= Greater Than or Equal to. To guarantee this condition works, the Condition Field needs to be a Number field type.
6. The Condition Value is 60. Below are both conditions separated by "Or."