AngularJS Form Validation

AngularJS Form Validation

In this Post We Will Explain About is AngularJS Form Validation With Example and Demo.Welcome on Pakainfo.com – Examples, The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to angularjs form validation on submitExample

In this post we will show you Best way to implement AngularJS Form Validation With ngMessages, hear for Easy Form Validation in AngularJS with ngMessageswith Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

AngularJS provides simple client-side HTMLform validation. It checks the some state of the HTML form and DOM input fields ( Like as a input, textarea box, select box), and lets We notify the all the user about the current state means errors.

It also holds the some information about whether the HTML input fields have been some touched, or all the data modified, or not.

There are the Following directives are used to track some errors in an AngularJS HTML form:

1> $dirty – angular states that some value has been changed.
2> $invalid – angular states that some value entered is invalid.
3> $error – angular states the some exact error.

Code : AngularJS Form Validation Example

index.html

  
   
     
      <title>Step By step Angular JS Forms</title>  
        
        
   
	//Devloped By Pakainfo.com
         table, th , td {  
            border: 1px solid grey;  
            border-collapse: collapse;  
            padding: 5px;  
         }  
     //Devloped By Pakainfo.com      
         table tr:nth-child(odd) {  
            background-color: lightpink;  
         }  
      //Devloped By Pakainfo.com     
         table tr:nth-child(even) {  
            background-color: lightyellow;  
         }  
        
        
     
     
        
      <h2>Live AngularJS Sample Application</h2>  
      <div>  
           
         <form name="empForm">  
            <table border="0">  
               <tr>  
                  <td>Enter first name:</td>  
                  <td>  
                     <span style="color:red">  
                        <span>Your First Name is required.</span>  
                     </span>  
                  </td>  
               </tr>  
                 
               <tr>  
                  <td>Enter last name: </td>  
                  <td>  
                     <span style="color:red">  
                        <span>Your Last Name is required.</span>  
                     </span>  
                  </td>  
               </tr>  
                 
               <tr>  
                  <td>Email: </td><td>  
                     <span style="color:red">  
                        <span>Your Email is required.</span>  
                        <span>Your Invalid email address.</span>  
                     </span>  
                  </td>  
               </tr>  
                <tr>  
                  <td>  
                     <button>Reset</button>  
                  </td>  
                  <td>  
                     <button>Submit</button>  
                  </td>  
               </tr>  
     </table>  
         </form>  
      </div>  
          
         var liveApp = angular.module("liveApp", []);  
         liveApp.controller('EmpCtrl', function($scope) {  
            $scope.dataReset = function(){  
               $scope.fname = "DSP";  
               $scope.lname = "Patel";  
               $scope.email = "[email protected]";  
            }  
             $scope.dataReset();  
         });  
        
       
  

Example

I hope you have Got What is AngularJS Form Validation And how it works.I would Like to have FeadBack From My Blog(Pakainfo.com) readers.Your Valuable FeadBack,Any Question,or any Comments abaout This Article(Pakainfo.com) Are Most Always Welcome.


Related FAQ

Here are some more FAQ related to this Article:

  1.   Image Zoom In Zoom Out using JQuery
  2.   Multiple Database Connections using Laravel
  3.   Simple Validations using Angular Example
  4.   VueJS Add active class li onClick navigation menu item
  5.   Simple Jquery Search Filter Example
  6.   Form Submission With Validation Using Vue.JS and PHP
  7.   Angularjs Form Validation Example Tutorial From Scratch
  8.   ng-table using Angular Example
  9.   Difference between break and continue
  10.   Simple Pagination with Laravel and MySQl