International Phone Number Validate Plugin with jQuery – mobilePhoneNumber

A jQuery plugin is a phone number input mask that is the perfect solution for its international users. It automatically formats and validates international phone numbers when a user is typing, so it’s easy to enter their information without any hassle. We know how frustrating it can be when people try to contact you via email instead of calling because they don’t have all the correct information. With our jQuery plugin, you won’t have that problem anymore! This conjunction is created to offer a better user experience using number input telephones. This simple tool makes sure everyone gets what they want from each call or message – which means better customer service overall!

How to use :

Add with jQuery library and jQuery caret plugin on the web page and add with jQuery mobilePhoneNumber plugin

<script src="jquery/1.11.1/jquery.min.js"></script>
<script src="vendor/jquery.caret.js"></script>
<script src="lib/jquery.mobilePhoneNumber.js"></script>

Create a phone number input on your web page.

<input type="tel" class="tel" pattern="\d*" x-autocompletetype="tel" placeholder="Mobile Phone Number" autofocus>

Add javascript for validate input number.

jQuery(function($){
var input = $('[type=tel]')
input.mobilePhoneNumber({allowPhoneWithoutPrefix: '+1'}); // U.S.
input.bind('country.mobilePhoneNumber', function(e, country) {
$('.country').text(country || '')
})
});

The API to validate phone numbers.

$('input.phone-num').val(); //=> '+1 (415) 123-5554'
$('input.phone-num').mobilePhoneNumber('validate'); //=> true

$('input.phone-num').val(); //=> '+43'
$('input.phone-num').mobilePhoneNumber('validate'); //=> false

Done