Conditional Logic - Ninja Forms

Table of Contents

• Show and Hide Fields
• Change Values in Fields
• Add and Remove List Options
• Determine When an Action is Processed
• List Fields with Conditional Logic
• Date/Time Fields with Conditional Logic

Show and Hide Fields

SHOW and HIDE should only be used under IF CONDITION IS NOT MET when using PARTS ( within a Multi-Part form ) Otherwise, create DO statements for FIELDS and do not use IF CONDITION IS NOT MET.

Multi-Part Forms Parts
– Do and If Conditions Is Not Met

Regular Forms Fields
– only DO

The Conditional Logic plugin can be used to show and hide form fields based off of the user’s inputs.
In this example, the submit button is hidden until the “Terms and Conditions” are agreed to.

After the fields of your form have been setup, you can add logic to any field by selecting Conditional Logic under the Advanced heading in the form builder.

Here you can change the conditional statement, or add a new one.

[Jump to top]

Change Values in Fields

The plugin can also be used to change field values.
In this example, the value in a field called “Discount” is changed to 10 if the “Member” option is chosen from the list.

After the fields of your form have been setup, you can add logic to any field(s) by selecting Conditional Logic under the Advanced heading in the form builder.

Once in the Conditional Logic section, you can change the conditional statement, or add a new one.

[Jump to top]

Add and Remove List Options

Similar to how the plugin can be used to change field values, we can use it to add or remove list field options.
In this example, the option to add a “Warranty” is only added to the list when the option for the “3rd Package” is chosen.

After the fields of your form have been setup, you can add logic to any field(s) by selecting Conditional Logic under the Advanced heading in the form builder.

Here you can change the conditional statement, or add a new one.

[Jump to top]

Determine When an Action is Processed

Logic can also be applied to Actions to have the determination on whether or not they are processed on submission, based on inputs into the form by the user.
In this example, the Email Action will only be processed if the user selects “Marketing” from the list.

Open your Action and at the bottom of the Action, you will see the Conditional Logic section.

Under this section, you can change the conditional statement, or add a new one.

[Jump to top]

List Fields with Conditional Logic

First, as you can see, we have a list field with three options(one, two, and three) and we have three textbox fields that we will show and hide based on the option selected in the list field.

Let’s get started by creating our “default state”, a default state is how we want the form to display data from the default position. We do this by creating a conditional statement that Shows the first field on our form(Textbox One) and hiding the others(Textbox Two and Textbox Three).

Next we need to create conditions similar to this one for the other two fields.

Now your form should display the textbox that corresponds with the option that is selected in the list field.

[Jump to top]

Date/Time Fields with Conditional Logic

Conditional Logic can be applied to the Date/Time field to trigger other actions and display/hide form fields or steps based on the date a user selects. Time comparison may be added in the future but is not currently possible. Under the Advanced tab of the form builder, select Conditional Logic and set When to Date/Time:

Then enter the date you want to trigger the logic on in a YYYY-MM-DD format.

• Before will trigger the logic if the user inputs a date before the date you input here
• On or Before will trigger the logic if the user inputs a date before the date you input here, or if they enter the same date you have here
• Is will trigger the logic if the user inputs the exact date you input here
• On or After will trigger the logic if the user inputs a date after the date you input here or if they enter the same date you have here
• After will trigger the logic if the user inputs a date after the date you input here