Form Conditional Actions

Creating branching forms or skip logic with webforms in Web Express is very simple. Conditional actions provide the form builder with the ability to display particular form elements based on a previous selection by the form user. There are many possible combinations of components and actions that can be utilized.  

A few examples are:

  • Show and hide components based on "Select options" components that the form user has selected.
  • Show and hide all components contained in a fieldset.
  • Show and hide webform pages.
  • Email submitted form to one email address or another based on form user component choice.

This tutorial shows you the basics but keep in mind that conditions can get extremely complex. The best way to learn about conditional actions is to get in and experiment with the different things you can use and affect. 

Note: you must enable the Forms bundle to use this feature.

1

Create a Webform

  1. To begin, you'll need to create a webform. 
  2. Add a few components, including a simple Textfield and a Select options field with at least two options.

Form components

2

Add a New Condition

  1. Click on the Conditionals tab.
  2. To add the first conditional, click on the plus sign next to the Add a new condition text. A group of form controls will appear.

Conditionals tab

3

Fill Out the Conditional Logic

  1. The first selection you need to make is the component that you want to base your condition on. Choose component from first drop-down list.

    Conditional first selection
  2. The next field applies a method of comparison such as is, is not, empty, not empty, etc. 

    Method of comparison field
  3. The next field in our example are the options keys from our selected component, the system will automatically provide a drop-down that contains the options that we configured within our component. This is the "condition".

    Options keys
  4. Now we need to tell the system what should happen if the form user selects the option/condition. The then statement is the component that will be affected by the condition, so we'll call this the "reactive component".

    Reactive component
  5. The field next to the reactive component, is the "reaction", a simple drop-down that contains an is and an isn't.

    Reaction component
  6. The field next to the reaction field determines what action is taken to the reactive component given a particular condition, so we'll call it the "result". 

    Result component
4

Save Conditions

You may continue to add more conditions if applicable. When you are done click  Save Conditions.

Related Articles