Javascript Phone Number Validation for North America

North America Phone Number Validation in Forms

In forms when asking for phone numbers for North American countries (under the NANP) it is a good idea to use client side javascript validation along with your programming language validation. The following example shows how you can do this.

North American Numbering Plan (NANP)

The North American Numbering Plan (NANP) is an integrated telephone numbering plan of 24 countries and territories: the United States and its territories, Canada, Bermuda, and 16 Caribbean nations.

Please Note: Despite the "North American" name of the calling plan, Mexico, the Central American countries and some Caribbean nations are not part of the system.

A phone number in the NANP will start with a three-digit area code which is followed by a seven-digit telephone number that directs telephone calls to particular regions on a public switched telephone network (PSTN), where they are further routed by the local network.

We have also provided the javascript phone validation for the Internationl Phone number validation, U.S. number and General Phone Number validation using javascipt reular expresson.

Example

Example of Phone Validation

View Explanation of the Code

Cut and Paste Code

Cut 'n' paste code for the above Example

JavaScript Code

/**

* DHTML phone number validation script. Courtesy of SmartWebby.com (http://www.smartwebby.com/dhtml/)

// Declaring required variables

var digits = "0123456789";

// non-digit characters which are allowed in phone numbers

var phoneNumberDelimiters = "()- ";

// characters which are allowed in international phone numbers

var validWorldPhoneChars = phoneNumberDelimiters ;

// Minimum no of digits in an north america phone no.

var minDigitsInIPhoneNumber = 10;

// Maximum no of digits in an america phone no.

var maxDigitsInIPhoneNumber = 13;

function isInteger(s)

{   var i;

for (i = 0; i < s.length; i++)

{

// Check that current character is number.

var c = s.charAt(i);

if (((c < "0") || (c > "9"))) return false;

}

// All characters are numbers.

return true;

}

function stripCharsInBag(s, bag)

{   var i;

var returnString = "";

// Search through string's characters one by one.

// If character is not in bag, append to returnString.

for (i = 0; i < s.length; i++)

{

// Check that current character isn't whitespace.

var c = s.charAt(i);

if (bag.indexOf(c) == -1) returnString += c;

}

return returnString;

}

function trim(s)

{   var i;

var returnString = "";

// Search through string's characters one by one.

// If character is not a whitespace, append to returnString.

for (i = 0; i < s.length; i++)

{

// Check that current character isn't whitespace.

var c = s.charAt(i);

if (c != " ") returnString += c;

}

return returnString;

}

function checkInternationalPhone(strPhone){

strPhone=trim(strPhone)

//if(strPhone.indexOf("(")==-1 && strPhone.indexOf(")")!=-1)return false

//if(strPhone.indexOf("(")!=-1 && strPhone.indexOf(")")==-1)return false

s=stripCharsInBag(strPhone,validWorldPhoneChars);

var CCode=s.substring(0,s.length-10)

var NPA=s.substring(s.length-10,s.length-7)

var NEC=s.substring(s.length-7,s.length-4)

if(CCode!="" && CCode!=null){

if(CCode!="1" && CCode!="011") return false

}

if(NPA.indexOf(1)==0) return false

if(NEC.indexOf(1)==0) return false

return (isInteger(s) && s.length >= minDigitsInIPhoneNumber  &&  s.length <= maxDigitsInIPhoneNumber );

}

function ValidateForm(){

var Phone=document.frmSample.txtPhone

if ((Phone.value==null)||(Phone.value=="")){

alert("Please Enter your Phone Number")

Phone.focus()

return false

}

if (checkInternationalPhone(Phone.value)==false){

alert("Please Enter a Valid Phone Number")

Phone.value=""

Phone.focus()

return false

}

return true

}

</script>

HTML Code

Explanation of the Code

The JavaScript has the following main functions:

Function checkInternationalPhone is used to verify if the given value is a possible valid international phone number : This function first removes all non-digit characters which are allowed in phone numbers. These delimiters are declared in the lines (found in the beginning of the code) :

var phoneNumberDelimiters = "()- "
var validWorldPhoneChars = phoneNumberDelimiters + "+"

Now that all valid delimiters are removed we just check if the remaining value is an integer and that it has at least a certain number of digits (given by the variable 'minDigitsInIPhoneNumber').
Function ValidateForm is used to make sure that the phone number field is not blank and area code should be started between 2 and 9 and maximum digits should not be greater than 15 digits that it is a valid phone number on form submission

Javascript Phone Number Validation

NANP Phone Number Validation