jQuery validation of NANP Phone numbers

0 votes

I'm trying to validate my form. In my form is a phone number field. The user inserts a phone number and validation takes place as well as formatting. I've read a lot of the other similar questions in StackOverflow and through searches elsewhere, but I'm stuck. The form keeps saying that a valid number I insert is invalid.

I'm only concerned with NANP numbers and I understand the NANP numbers are formatted like this: NXX-NXX-XXXX, where N can only be digits [2-9], and X can be [0-9]. I don't need a country code.

Here's my code:

function validatePhone(){
    var error = 1;

    var hasError = false;
    var $this = $(this);
    var regex1 = /^(\()?[2-9]{1}\d{2}(\))?(-|\s)?[2-9]{1}\d{2}(-|\s)\d{4}$/;

    phone = $(this).val();
    phone = phone.replace(/[^0-9]/g,'');        
    if(!regex1.test(phone)){
        hasError = true;
        $this.css('background-color','#FFEDEF');
    }   
    else{
        area = phone.substring(0,3);
        prefix = phone.substring(3,6);
        line = phone.substring(6);
        $this.val('(' + area + ') ' + prefix + '-' + line);
        $this.css('background-color','#FFFFFF');    
    }

The idea is that no matter whether I insert 8012559553, (801)2559553, (801)255-9553, 801-255-9553 or something similar that it would be validated and formatted like this: (801) 255-9553. But again, the form for some reason continues to say that any number I insert is invalid, regardless of whether it's valid or not. This is code that I was using that was working, but didn't comply with NANP formats:

function validatePhone(){
    var error = 1;

    var hasError = false;
    var $this = $(this);
    phone = $(this).val();
    phone = phone.replace(/[^0-9]/g,'');        
    if(phone.length != 10){
            hasError = true;
            $this.css('background-color','#FFEDEF');
    }   
    else{
            area = phone.substring(0,3);
            prefix = phone.substring(3,6);
            line = phone.substring(6);
            $this.val('(' + area + ') ' + prefix + '-' + line);
            $this.css('background-color','#FFFFFF');    
    }

So, I'm having trouble implementing the regex test of the numbers to make sure that the numbers are real and then have the number formatted correctly... Any ideas?

Aug 19 in Web Development by gaurav
• 18,960 points
93 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.

Related Questions In Web Development

0 votes
1 answer

Pure JS equivalent of Jquery eq()

To get the element index in the ...READ MORE

answered Jun 23 in Web Development by rajatha
• 7,440 points
92 views
0 votes
1 answer

$("#select option:second").val() jquery - keep select second value of select box option

Yes, you want the special jQuery eq() selector. ...READ MORE

answered Jun 22 in Web Development by rajatha
• 7,440 points
32 views
0 votes
1 answer

jQuery get value of select onChange

Try this- $('select').on('change', function() { alert( this.value ...READ MORE

answered Jun 23 in Web Development by rajatha
• 7,440 points
63 views
0 votes
1 answer

jQuery get value of select onChange

To get the value and text of ...READ MORE

answered Jun 23 in Web Development by rajatha
• 7,440 points
38 views
0 votes
1 answer

jQuery get value of selected radio button

Input Radio value Property Get the value of ...READ MORE

answered Jun 23 in Web Development by rajatha
• 7,440 points
467 views
0 votes
1 answer

Why use jQuery on() instead of click()

The . on() method attaches event handlers to ...READ MORE

answered Jun 27 in Web Development by rajatha
• 7,440 points
27 views
0 votes
0 answers

Email validation using jQuery

How can I use JQuery to validate ...READ MORE

May 21 in JQuery by Kichu
• 19,040 points
49 views
0 votes
1 answer

Email validation using jQuery

You can use regular old javascript for ...READ MORE

answered Jun 3 in JQuery by Edureka
• 13,640 points
65 views
0 votes
1 answer

Jquery form submit validation

Bind a function to the submit event of the ...READ MORE

answered Jun 20 in JQuery by rajatha
• 7,440 points
148 views
0 votes
1 answer
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP