Last updated on October 18, 2023

WP Forms conditional logic

Don’t know where to add this snippet? Read our guide: How to add code snippets.

Create dynamic forms with WP Forms.

Conditional logic in WP Forms allows you to show or hide form fields based on certain conditions. This is useful when you want to create dynamic and personalized forms for your users. By using conditional logic, you can make your forms more interactive and user-friendly.

To implement conditional logic in WP Forms, you can use the wpforms_process_filter hook along with the wpforms_frontend_fields filter. Here’s an example of how you can achieve this:

/**
 * Add conditional logic to WP Forms.
 *
 * @param array $fields The form fields.
 * @param int   $form_id The form ID.
 *
 * @return array The modified form fields.
 */
function wpsnippets_add_conditional_logic( $fields, $form_id ) {
    // Add your conditional logic here
    // Example: Show a field if a checkbox is checked
    if ( isset( $fields['checkbox_field'] ) && $fields['checkbox_field']['value'] == 'yes' ) {
        $fields['conditional_field']['isHidden'] = false;
    } else {
        $fields['conditional_field']['isHidden'] = true;
    }

    return $fields;
}
add_filter( 'wpforms_frontend_fields', 'wpsnippets_add_conditional_logic', 10, 2 );

In the above example, we’re using the wpforms_frontend_fields filter to modify the form fields based on the provided conditions. The wpsnippets_add_conditional_logic function takes two parameters: $fields (the form fields) and $form_id (the ID of the form being processed).

Inside the function, you can define your conditional logic. In this example, we’re checking if a checkbox field with the key checkbox_field is checked. If it is, we set the isHidden property of the field with the key conditional_field to false, which means the field will be shown. Otherwise, we set it to true, which means the field will be hidden.

You can customize the conditional logic based on your specific requirements. You can check for different field values, compare multiple fields, or use other conditions as needed.

Remember to replace checkbox_field and conditional_field with the actual keys of your form fields.

By adding this code snippet to your theme’s functions.php file or a custom plugin, you’ll be able to implement conditional logic in WP Forms and create dynamic forms that adapt to user input.

Examples

Example 1: Showing or hiding form fields based on user input

This use case demonstrates how to use WP Forms conditional logic to show or hide form fields based on user input. In this example, we have a form with two fields: a dropdown field and a text field. When the user selects a specific option from the dropdown, the text field will be shown or hidden accordingly.

add_filter( 'wpforms_frontend_form_fields', 'wpsnippets_show_hide_form_fields' );
function wpsnippets_show_hide_form_fields( $fields ) {
    $fields['dropdown_field']['conditional_logic'] = array(
        'show' => array(
            'field'    => 'text_field',
            'operator' => '!=',
            'value'    => 'hide',
        ),
    );
    return $fields;
}

Explanation: We use the wpforms_frontend_form_fields filter to modify the form fields. In the code example, we add a conditional logic rule to the dropdown field. If the value of the dropdown field is not equal to “hide”, the text field will be shown. Otherwise, the text field will be hidden.

Example 2: Changing the required status of a form field based on user input

This use case demonstrates how to use WP Forms conditional logic to change the required status of a form field based on user input. In this example, we have a form with a checkbox field and a text field. When the user checks the checkbox, the text field becomes a required field.

add_filter( 'wpforms_frontend_form_fields', 'wpsnippets_change_required_status' );
function wpsnippets_change_required_status( $fields ) {
    $fields['checkbox_field']['conditional_logic'] = array(
        'required' => array(
            'field'    => 'text_field',
            'operator' => '==',
            'value'    => '',
        ),
    );
    return $fields;
}

Explanation: We use the wpforms_frontend_form_fields filter to modify the form fields. In the code example, we add a conditional logic rule to the checkbox field. If the value of the checkbox field is empty, the text field becomes a required field.

Example 3: Showing or hiding entire form sections based on user input

This use case demonstrates how to use WP Forms conditional logic to show or hide entire form sections based on user input. In this example, we have a form with two sections: “Section A” and “Section B”. When the user selects a specific option from a dropdown field, either “Section A” or “Section B” will be shown, while the other section will be hidden.

add_filter( 'wpforms_frontend_form_fields', 'wpsnippets_show_hide_form_sections' );
function wpsnippets_show_hide_form_sections( $fields ) {
    $fields['dropdown_field']['conditional_logic'] = array(
        'show' => array(
            'section'  => 'section_a',
            'operator' => '==',
            'value'    => 'show',
        ),
        'hide' => array(
            'section'  => 'section_b',
            'operator' => '==',
            'value'    => 'show',
        ),
    );
    return $fields;
}

Explanation: We use the wpforms_frontend_form_fields filter to modify the form fields. In the code example, we add conditional logic rules to the dropdown field. If the value of the dropdown field is “show”, “Section A” will be shown and “Section B” will be hidden. If the value is not “show”, the opposite will happen.

Last updated on October 18, 2023. Originally posted on January 20, 2024.

Leave a Reply