Skip to main content

Setting Up Conditional Logic in Divi Form Builder

Conditional logic allows you to create dynamic forms by displaying or hiding certain fields based on the user's input in other fields. For instance, you can set it so that only specific fields show when certain conditions are met, such as when a user selects a particular option from a dropdown menu.

For more detailed information, please click HERE. and read through the additional documentation.

How Conditional Logic Works?​

The essence of this feature is that it enables one field to display based on the selection made in another field. For example, if the user selects "Option A" from a select dropdown, a second field (e.g., a text input) will appear in the form.

Add Form Field One​

  1. Navigate to the page with your form and open the Form Builder module.
  2. Click on the Add New Field button to start adding a new form field.
  3. Enter a descriptive Field Title for the field that users will see.
  4. Enter a Admin Title for administrative purposes to help identify the field.
  5. Assign a unique Field ID to the field for data handling.
  6. Select the Type from the Type dropdown menu.

Add Form Field One

Add Form Field Two​

  1. Navigate to the page with your form and open the Form Builder module.
  2. Click on the Add New Field button to start adding a new form field.
  3. Enter a descriptive Field Title for the field that users will see.
  4. Enter a Admin Title for administrative purposes to help identify the field.
  5. Assign a unique Field ID to the field for data handling.
  6. Select the Type from the Type dropdown menu.

Add Form Field Two

Configure Conditional Logic in Form Field Two​

  1. Go to the Conditional Logic section of the second field's settings.
  2. Enable Conditional Logic by toggling the switch to "On."
  3. Create the rules for how this field will display.

Configure Conditional Logic in Form Field Two

Example Configuration​

  1. Field One (Dropdown): Options include A, B, C.
  2. Field Two (Text Input): This field will only display when "Option A" is selected in Field One
  3. Conditional Logic Rule Setup:
    1. Field One Equal A: When this rule is set, Field Two will display only when Field One is set to "Option A."

Step 4: Save and Test​

Preview your form to ensure the conditional logic works as expected. Select different options in the first field to see if the second field appears or hides accordingly.

Additional Tips​

By following these steps, you can create a dynamic and user-friendly form using conditional logic in Divi Form Builder.

Last updated on