Validate phone number using angular js
Try this:
<form class="form-horizontal" role="form" method="post" name="registration" novalidate> <div class="form-group" ng-class="{'has-error': registration.phone.$error.number}"> <label for="inputPhone" class="col-sm-3 control-label">Phone :</label> <div class="col-sm-9"> <input type="number" class="form-control" ng-minlength="10" ng-maxlength="10" id="inputPhone" name="phone" placeholder="Phone" ng-model="user.phone" ng-required="true"> <span class="help-block" ng-show="registration.phone.$error.required || registration.phone.$error.number"> Valid phone number is required </span> <span class="help-block" ng-show="((registration.phone.$error.minlength || registration.phone.$error.maxlength) && registration.phone.$dirty) "> phone number should be 10 digits </span>
Basically you can create a regex to fulfil your needs and then assign that pattern to your input field.
Or for a more direct approach:
<input type="number" require ng-pattern="<your regex here>">More info @ angular docs here and here (built-in validators)
You can also use ng-pattern ,[7-9] = > mobile number must start with 7 or 8 or 9 ,[0-9] = mobile number accepts digits ,{9} mobile number should be 10 digits.
function form($scope){ $scope.onSubmit = function(){ alert("form submitted"); }}<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script><div ng-app ng-controller="form"><form name="myForm" ng-submit="onSubmit()"> <input type="number" ng-model="mobile_number" name="mobile_number" ng-pattern="/^[7-9][0-9]{9}$/" required> <span ng-show="myForm.mobile_number.$error.pattern">Please enter valid number!</span> <input type="submit" value="submit"/></form></div>