How do I reset a form including removing all validation errors?

Question

I have an Angular form. The fields are validated using the ng-pattern attribute. I also have a reset button. I\'m using the Ui.Utils Event Binder to handle the

Answer 1

It looks like I got to do the right behavior at reset. Unfortunately, using the standard reset failed. I also do not include the library ui-event. So my code is a little different from yours, but it does what you need.

  pristine = {{searchForm.$pristine}} valid ={{searchForm.$valid}}
  

    
      Area Code
      
    

    

      
The area code must be three digits
      
The area code is required
    
  

  

    
      Phone Number
      
    

    

      
The phone number must be seven digits
      
The phone number is required
    
  

  

  

    Reset
    Search
  

And JS:

$scope.resetCount = 0;
$scope.obj = {};
$scope.reset = function(form_) {
  $scope.resetCount++;
  $scope.obj = {};
  form_.$setPristine();
  form_.$setUntouched();
  console.log($scope.resetCount);
};

$scope.search = function() {
  alert('Searching');
};

Live example on jsfiddle.

Note the directive ng-model-options="{allowinvalid: true}". Use it necessarily, or until the entry field will not be valid, the model value is not recorded. Therefore, the reset will not operate.

P.S. Put value (areaCode, phoneNumber) on the object simplifies purification.