angularjs-validation

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>

validate natural input number with ngpattern

The problem is that your REGX pattern will only match the input “0-9”. To meet your requirement (0-9999999), you should rewrite your regx pattern: ng-pattern=”/^[0-9]{1,7}$/” My example: HTML: <div ng-app ng-controller=”formCtrl”> <form name=”myForm” ng-submit=”onSubmit()”> <input type=”number” ng-model=”price” name=”price_field” ng-pattern=”/^[0-9]{1,7}$/” required> <span ng-show=”myForm.price_field.$error.pattern”>Not a valid number!</span> <span ng-show=”myForm.price_field.$error.required”>This field is required!</span> <input type=”submit” value=”submit”/> </form> </div> … Read more