<html ng-app="myApp">  
    <head>  
        <title>Validation Example</title>  
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>  
    </head>  
    <body>     
       
     <div ng-controller="controler" >  
            <form name="Form" ng-submit="fuSave()">  
            <table border="1" cellspacing="0" cellpadding="10">  
                <tr>  
                    <td>Name</td>  
                    <td><input type="text" required  maxlength="60" ng-pattern="/^[a-zA-Z. ]*[a-zA-Z]{1,60}$/"  name="name"  ng-model="name" />   
                     <br/>                  
                     <span style="color:red" ng-show="From.name.$dirty && From.name.$invalid" class="ng-hide">   
                      Please Enter Valid  Name
                     </span>  
                    </td>                 
                </tr>  
                <tr>                  
                    <td>Date Of Birth (dd/mm/yyyy)</td>  
                    <td><input type="text" required ng-pattern="/^(0[1-9]|[12][0-9]|3[01])[\/](0[1-9]|1[012])[\/](19|20)\d\d$/"  ng-model="dob" name="dob" />  
                      <br/>                     
                     <span style="color:red" ng-show="From.dob.$dirty && From.dob.$invalid" class="ng-hide">   
                       Please Enter Valid  DOB
                       </span>  
                    </td>  
                </tr>  
                <tr>  
                    <td>Email</td>  
                    <td><input type="text" maxlength="100" required ng-pattern="/^\w+@[a-zA-Z_]+?\.[a-zA-Z]{2,3}$/" name="email" ng-model="email" />      
                    <br/>                   
                    <span style="color:red" ng-show="From.email.$dirty && From.email.$invalid" class="ng-hide">   
                    Please Enter Valid  Email  
                    </span>                  
                    </td>  
                    </tr>  
                      
                    <tr>  
                    <td>Mobile No </td>  
                    <td><input type="text" required maxlength="10" ng-pattern="/^[7-9][0-9]{9}$/" name="mobileno" ng-model="mobileno" />   
                     <br/>                      
                    <span style="color:red" ng-show="From.mobileno.$dirty && From.mobileno.$invalid" class="ng-hide">   
                       Please Enter Valid  Mobile No 
                       </span>  
                    </td>  
                   </tr>  
                     
                    <tr>  
                    <td>Pin code </td>  
                    <td><input type="text" required maxlength="6" ng-pattern="/^[1-9][0-9]{5}$/" name="pincode" ng-model="pincode" />  
                     <br/>      
                    <span style="color:red" ng-show="From.pincode.$dirty && From.pincode.$invalid" class="ng-hide">   
                       Please Enter Valid  Pin
                       </span>  
                    </td>  
                </tr>  
                 
                <tr>  
                    <td colspan="4" style="text-align:center"><input type="submit" value="submit" /></td>  
                </tr>  
            </table>  
    </form>  
     </div>     
     </body>  
    </html>   

	    <script>  
     var app = angular.module("myApp", []);  
          app.controller('controler',function($scope){  
              
           $scope.fuSave = function()  
           {  
              if($scope.Form.$valid) {  
                 alert("Form is Valid..!!");  
                 }  
              else  
              {  
              alert("Form is not Valid..!!");  
              }  
           }  
             
           })      
                
    </script>  

Your Answer
Sign In
Enter email and password to comment or answer
Not the answer you are looking for? Browse other questions tagged or ask your own question.