CODEWITHSUNDEEP
htmlangularjsforms
Manahil
Manahil

Reputation: 265

Unable to clear form fields after Submit in Angular

I am new to angular. I have looked up a lot of answers on clearing form fields after submitting but none seems to work. Here's my HTML code:

  <form name="myForm" ng-submit="formSubmit()" class="form-horizontal">

      <div class="form-group">

       <input type="text" class="form-control" ng-model="user.FullName" placeholder="Full Name" required=""/>

      </div>
      <div class="form-group">
      <input type="text" class="form-control" ng-model="user.Address" placeholder="Address" required=""/>
         </div>
     <button type="submit" class="btn btn-primary" style="background-color: purple;">Submit</button>

 </form>

Here's my JS code:

 var myApp = angular.module('myApp', ['ui.router']); 
 myApp.controller("RegisterCtrl", function ($window,$scope,$http) {
   $scope.user={}
   $scope.formSubmit=function(){
     $http({
        method:'POST',
        url:'myurl',
        data:$scope.user,
        headers:{'Content-Type':'application/json'}
    }).then(function(res){
            console.log(res);
             $scope.myForm.$setPristine(); 
             $scope.myForm.$setPristine(true); 
             $scope.myForm='';      


      })
     }
  });

I have tried setPristine as well as setUntouched but none working.

Upvotes: 0

Views: 170

Answers (2)

Ankur Pohekar
Ankur Pohekar

Reputation: 139

you should try

var myApp = angular.module('myApp', ['ui.router']); 
 myApp.controller("RegisterCtrl", function ($window,$scope,$http) {
   $scope.user={}
   $scope.formSubmit=function(){
     $http({
        method:'POST',
        url:'myurl',
        data:$scope.user,
        headers:{'Content-Type':'application/json'}
    }).then(function(res){
        $scope.$broadcast('show-errors-reset');
        $scope.forms.user = {};
        $scope.forms.userFrom.$setPristine = true;
      }, function(rej){ //error});
 }
 });

Upvotes: 1

Jesus Carrasco
Jesus Carrasco

Reputation: 1354

I don't see something strange in your code, i make plnkr based on your code, the modifications i do are below. also put the plnkr sample

CONTROLLER

var myApp = angular.module('myApp', ['ui.router']); 
 myApp.controller("RegisterCtrl", function ($window,$scope,$http) {
   $scope.user={}
   $scope.formSubmit=function(){
     $http({
        method:'POST',
        url:'myurl',
        data:$scope.user,
        headers:{'Content-Type':'application/json'}
    }).then(function(res){
        $scope.myForm.$setPristine();
        $scope.user = {};
      }, function(rej){ //error});
 }
 });

Upvotes: 1

Related Questions