forms - How to add custom regex validation to WPForms password field

I'm using WPForms Pro and I'd like to add custom requirements to the password field on a form.

I know that the password field has a password strength requirement setting, but I have specific rules I'd like to enforce, which are:

• Between 12 and 32 characters
• At least 1 number
• At least 1 capital letter
• At least 1 special character

I came up with the following regex for this: ^(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{12,32}$

and wrote to WPForms support, who told me that they can only go as far as giving me a code snippet to enforce a minimum length:

/**
 * Require number of characters allowed for an input field
 * Apply the class "wpf-char-require" to the field to enable.
 *
 */
function wpf_dev_char_require() {
    ?>
    <script type="text/javascript">
        jQuery(function($){
            $('.wpf-char-require input').attr('minlength',4); // Change number to character requirement (input fields)
        });
    </script>
    <?php
}
add_action( 'wpforms_wp_footer', 'wpf_dev_char_require' );

(I'd add the wpf-char-require class to the field I want to validate).

How can I modify this to validate using my regex instead of the rule they've given me?

I'm using WPForms Pro and I'd like to add custom requirements to the password field on a form.

I know that the password field has a password strength requirement setting, but I have specific rules I'd like to enforce, which are:

• Between 12 and 32 characters
• At least 1 number
• At least 1 capital letter
• At least 1 special character

I came up with the following regex for this: ^(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{12,32}$

and wrote to WPForms support, who told me that they can only go as far as giving me a code snippet to enforce a minimum length:

/**
 * Require number of characters allowed for an input field
 * Apply the class "wpf-char-require" to the field to enable.
 *
 */
function wpf_dev_char_require() {
    ?>
    <script type="text/javascript">
        jQuery(function($){
            $('.wpf-char-require input').attr('minlength',4); // Change number to character requirement (input fields)
        });
    </script>
    <?php
}
add_action( 'wpforms_wp_footer', 'wpf_dev_char_require' );

(I'd add the wpf-char-require class to the field I want to validate).

How can I modify this to validate using my regex instead of the rule they've given me?

• forms
• validation
• regex

Share Improve this question asked Apr 21, 2022 at 4:13 SidewinderSidewinder 10111 bronze badge 4

• have you contacted WPForms Pro support? 3rd party plugin/theme dev support questions are offtopic here and not in this stacks scope – Tom J Nowell ♦ Commented Apr 21, 2022 at 13:12
• @TomJNowell I have, I mentioned that in my post above. The snippet I have is from them. The reason I asked here is because they’re unwilling to support further, and I thought that this is more of a generic question about field validation that could pertain to any form, created with/without a plugin. – Sidewinder Commented Apr 21, 2022 at 13:17
• if you know how to change the minimum length then you have everything you need to replace that line with code that enforces a regex, you don't need WPForms or WordPress help to do the regular expression part, any javascript developer could answer that. Your question can be rephrased to completely remove WordPress and WP Forms as "Given an input html goes here, how would I apply a regex validation with jQuery?". That question could be asked on stackoverflow and reach a much larger number of people – Tom J Nowell ♦ Commented Apr 21, 2022 at 13:35
• Note thought that if PHP changes are needed to make WP Forms Pro enforce the validation then that is something you can't ask for help with here, even if their support routes say they can't help you. 3rd party plugin dev support questions are offtopic, even if their support routes refuse to help you – Tom J Nowell ♦ Commented Apr 21, 2022 at 13:36

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

I'm not sure about the password field but this is how I perform regular expression checks on my username field. I expect the process is very similar for passwords. Note make sure you set the target_form_id field so it only processes the form you intend. You can find this id on the embedded short code. Ensure you set the field id for the field you want to validate. You can find this on your wpforms properties side panel on the form designer. You can also set your own error display message. It will display soon as your field is invalid and you have tried to submit your form as per normal operation.

The add action and the below code you put into your functions.php

add_action( 'wpforms_process_validate_text', 'custom_wpforms_text_validation', 10, 3 );

Hope it helps someone

function custom_wpforms_text_validation( $field_id, $field_submit, $form_data ) {


    // Check if the form ID matches the target form ID
    $target_form_id = 104887;
    if ( absint( $form_data['id'] ) !== $target_form_id ) {
        return;
    }

    // Define your regular expression
    $regex = '/^[a-zA-Z0-9]+$/'; // Example: Alphanumeric characters only

    // Specify the field ID to validate
    $target_field_id = 1; // Replace with your field ID

    if ( $field_id == $target_field_id && ! preg_match( $regex, $field_submit ) ) {
        // Add an error message if validation fails
        wpforms()->process->errors[$form_data['id']][$field_id] = 'Invalid input. Please use only alphanumeric characters.';
    }
}