jQuery validate regex to disallow numerics and special characters

Question

I have a form that requires a field to not have any special characters or numerics. Currently it works fine with:

abc: no error.
123: error.
!@#$: error.

The issue is when I add something like #$%abc or abc123 it does not produce the the error I would expect.

The function I am using looks like:

$.validator.addMethod("checkallowedchars", function (value) {
    var pattern = new RegExp('[A-Za-z]+', 'g');
    return pattern.test(value)
}, "The field contains non-admitted characters");

JSFiddle shows the function/regex I am using: http://jsfiddle.net/nmL8maa5/

@Adrian, please check my answer below, and please let me know if anything is still unclear. — Wiktor Stribiżew
– Wiktor Stribiżew, Commented May 2, 2016 at 12:38

Wiktor Stribiżew · Accepted Answer · 2021-05-19 08:21:52Z

One of the correct answers is:

return /^[A-Z]+$/i.test(value);

and add

checkallowedchars: true,

to the rules.

See the updated demo fiddle (the one below does not work for me on SO, no idea why).

$(document).ready(function () {
    
    $.validator.addMethod("pwcheckallowedchars", function (value) {
        return /^[a-zA-Z0-9!@#$%^&*()_=\[\]{};':"\\|,.<>\/?+-]+$/.test(value) // has only allowed chars letter
    }, "The password contains non-admitted characters");

    $.validator.addMethod("checkallowedchars", function (value) {
        return /^[A-Z]+$/i.test(value);
    }, "The field contains non-admitted characters");

    $.validator.addMethod("pwcheckspechars", function (value) {
        return /[!@#$%^&*()_=\[\]{};':"\\|,.<>\/?+-]/.test(value)
    }, "The password must contain at least one special character");
    
    $.validator.addMethod("pwcheckconsecchars", function (value) {
        return ! (/(.)\1\1/.test(value)) // does not contain 3 consecutive identical chars
    }, "The password must not contain 3 consecutive identical characters");

    $.validator.addMethod("pwchecklowercase", function (value) {
        return /[a-z]/.test(value) // has a lowercase letter
    }, "The password must contain at least one lowercase letter");
    
    $.validator.addMethod("pwcheckrepeatnum", function (value) {
        return /\d{2}/.test(value) // has a lowercase letter
    }, "The password must contain at least one lowercase letter");
    
    $.validator.addMethod("pwcheckuppercase", function (value) {
        return /[A-Z]/.test(value) // has an uppercase letter
    }, "The password must contain at least one uppercase letter");
    
    $.validator.addMethod("pwchecknumber", function (value) {
        return /\d/.test(value) // has a digit
    }, "The password must contain at least one number");
    
    
    
    
    
    $('#myform').validate({
        // other options,
        rules: {
            "firstname.fieldOne": {
                required: true,
                checkallowedchars: true,
                pwchecklowercase: true,
                pwcheckuppercase: true,
                pwchecknumber: true,
                pwcheckconsecchars: true,
                pwcheckspechars: true,
                pwcheckallowedchars: true,
                minlength: 8,
                maxlength: 20
            }
        }
    });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/additional-methods.js"></script>
<form id="myform">
    <input type="text" name="firstname.fieldOne" /><br/>
    <br/>
    <input type="submit" />
</form>

There are two issues in your code:

The regex is not anchored, and when it is not anchored it matches partial substrings inside larger strings. Since it just matches 1+ letters, and #$%abc contains 3 letters, the condition is met.
The second issue is that your are using /g modifier wth RegExp.text(). This leads to unexpected behavior.

Aminah Nuraini · Accepted Answer · 2016-05-02 07:42:59Z

0

Use this:

^[A-Za-z]+$

Explanation:

^ is the string beginning anchor.
$ is the string end anchor.

You should use it for the regex to process the string from the beginning to the end, not including the middle.

answered May 2, 2016 at 7:42

Aminah Nuraini

19.4k9 gold badges98 silver badges113 bronze badges

2 Comments

Wiktor Stribiżew Over a year ago

Just sharing the pattern is not enough. There is an issue related to the regex/code.

Aminah Nuraini Over a year ago

Yup, he uses g flag. I don't know why is that.

Collectives™ on Stack Overflow

jQuery validate regex to disallow numerics and special characters

2 Answers 2

Comments

Explanation:

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Explanation:

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related