Validación javascript número teléfono correcto
by Yolanda Robles
HTML
<div ng-controller="Ctrl">
<form name="form" novalidate>
<label>Phone Number</label>
<input type="text" name="phone" data-phone ng-model="phone" />
<span ng-show="form.phone.$error.phoneField">Please enter a valid phone number.</span>
</form>
</div>
CSS
reino unido: +448888884532
rusia: +74957373007
suecia: +4647681000
quebec: +18668664532
JavaScript
var app = angular.module('myApp', []);
/*var PHONE_REGEXP = /^(\+|00)(9[976]\d|8[987530]\d|6[987]\d|5[90]\d|42\d|3[875]\d|2[98654321]\d|9[8543210]|8[6421]|6[6543210]|5[87654321]|4[987654310]|3[9643210]|2[70]|7|1)\d{1,14}$/;*/
var PHONE_REGEXP = /((?:\+|00)[17](?: |\-)?|(?:\+|00)[1-9]\d{0,2}(?: |\-)?|(?:\+|00)1\-\d{3}(?: |\-)?)?(0\d|\([0-9]{3}\)|[1-9]{0,3})(?:((?: |\-)[0-9]{2}){4}|((?:[0-9]{2}){4})|((?: |\-)[0-9]{3}(?: |\-)[0-9]{4})|([0-9]{7}))/g;
app.controller('Ctrl', function($scope) {});
app.directive('phone', function() {
return {
restrice: 'A',
require: 'ngModel',
link: function(scope, element, attrs, ctrl) {
angular.element(element).bind('blur', function() {
var value = this.value;
alert(value);
if(PHONE_REGEXP.test(value)) {
// Valid input
console.log("valid phone number");
angular.element(this).next().next().css('display','none');
} else {
// Invalid input
console.log("invalid phone number");
angular.element(this).next().next().css('display','block');
/*
Looks like at this point ctrl is not available,
so I can't user the following method to display the error node:
ctrl.$setValidity('currencyField', false);
*/
}
});
}
}
});