user1265533
user1265533

Reputation: 173

Jquery RegEx Validation

I am wanting to check if an input field has the attribute "pattern" and if so, preform a regex check aganst said pattern.I know this is already done by HTML5, but I am wanting to handle the event myself. I am receiving this error: Uncaught TypeError: Object a-zA-Z has no method 'test'

 ///Check Perform Reg///////////////////////////////////////////////////////
         if ($(this).attr("pattern")) {
             var reg = $(this).attr("pattern");
             var currentValue = $(this).val();


             if (reg.test(currentValue)) {
                 $(this).after($error.clone().text("Invalid Input.Try Again."));
                 $(".error:hidden").fadeIn("slow");
                 hasError = true;
                 return false;
             }

             }
        ///////////////////////////////////////////////////////////////////////////

Still no luck,

also here is my html:

<div>
    <input class="formInput" name="First Name" pattern="^[A-Za-z_-][A-Za-z0-9_-]*$" type="text"  id="frmFirst" min="2" maxlength="30"  required="required"/>
    <span>First Name</span>
</div>

Upvotes: 12

Views: 71040

Answers (5)

Qasim Bataineh
Qasim Bataineh

Reputation: 707

Below is the proper way to validate a text-box based on a regular Expression using Jquery in MVC. Please note that this expression is made to validate multi email addresses in one string:

      var emailReg = new RegExp(/^([A-Z0-9.%+-]+@@[A-Z0-9.-]+.[A-Z]{2,6})*([,;][\s]*([A-Z0-9.%+-]+@@[A-Z0-9.-]+.[A-Z]{2,6}))*$/i);
      var emailText = $('#email').val();

      if (!emailReg.test(emailText)) {
          alert('Wrong Email Address\Addresses format! Please reEnter correct format');
            return false;
        }
    }

Upvotes: 0

rrtx2000
rrtx2000

Reputation: 636

You can try something like this. It will alert "var2 failed".

var var1 = "1";
var var2 = "A";
var myRegEx = new RegExp('[0-9]+'); //make sure the var is a number

if (var1 != myRegEx.exec(var1)) {
    alert("var1 failed");
}

if (var2 != myRegEx.exec(var2)) {
    alert("var2 failed");
}

Upvotes: 5

deezy
deezy

Reputation: 515

As already mentioned by others you need to use an object instead of the string returned by the jQuery attr() method. You can see the difference between the two here.

Will return "string":

var reg = $(this).attr("pattern");
console.log(typeof reg)

Will return with "object":

var reg = new RegExp($(this).attr("pattern"));
console.log(typeof reg);

So if you replace:

var reg = $(this).attr("pattern");

With:

var reg = new RegExp($(this).attr("pattern"));

The Uncaught TypeError: Object a-zA-Z has no method 'test' error will disappear

...but your validation still won't work very well. Your conditional logic says if the regex test returns TRUE then handle an error:

if (reg.test(currentValue)) {
    //error handling
}

Instead it should handle an error if the test returns FALSE:

if (!reg.test(currentValue)) {
    //error handling
}

This should work for you.

Upvotes: 5

Qtax
Qtax

Reputation: 33928

A string is not a RegExp object. You could use something like:

var reg = new RegExp($(this).attr("pattern"));

Upvotes: 0

irfanmcsd
irfanmcsd

Reputation: 6571

Normally regular expression with javascript / jquery handle like

var reg = /pattern/;
if (reg.test($(this).val())) {
    // perform some task
}

Upvotes: 28

Related Questions