Form Validation in Angular.js - Quick and Simple method On Submit click - HTML5 Validation vs AngularJs Validation

• Form Validation Before AngularJs:
•  Validation done in java script or mostly with JQuery Validation .
• JQuery Validation uses Html 'Class' attribute of any Html element to implement Validations, like Class = " required  "
• And there were many different libraries to do simple and fancy validation - highlights in JQuery. 
• HTML5 Validation:
• In HTML5 you can add many element types and attributes like below to a HTML element for validations.
• InputTypes:
• email, url, number, color , date, datetime, datetime-local, month, search, tel, time, week, range
• Ex: 
  Date: <input type="date" name="date" required> 
• this will show a text box with a dropdown arrow for 'DatePicker' provided by the HTML5 supported browsers.
• Attributes:   
• required, pattern, placeholder, max, min, size,
•  All these validations and required fields are enforced by the HTML5 supported Browsers when you click on Submit button.
• Submit button OnClick - event will show markers to the required fields and invalid fields.
• novalidate  - attribute tells the browser not to validate the form. 
• CSS Style for Validation: You can style your validation alerts like this, (basically accessing the attributes)
• input:required:invalid{border: 1px solid red;} 
• This will show red border on all the invalid  'input' elements. 
• AngularJs:
•  AngularJs uses tons of directives (AngularJs Keywords or Syntax) that are all over in HTML, JavaScripts and in CSS.
• Usually it starts with an 'ng-'
• Simple and Quick Validation for all 'required' elements in AngularJs On Submit button click:  
• Add the following in relevant pages.
• In the form element:  
• ng-submit="submitForm(someform.$valid);" novalidate
• ex: <form   id="testform" name="testform"   ng-submit="submitForm(estform.$valid);" novalidate>
• In the controller:  

• $scope.submitForm = function(formvalid) {

  if (!formvalid)
  { alert("Form is invalid. Pl. check the fields for error and resubmit");}
          else{
        alert("Form is valid. Proceeding to submit.");
          SaveFormData();    //add this function to submit your data.

          }

• In the stylesheet : 
• /*angular styles*/form.ng-submitted .ng-invalid {
      border:  1px solid #f44d3c;

  }

• This will highlight a red border OnSubmit button click - all the elements contains 'required' attribute in them.