CODEWITHSUNDEEP
javascripthtmlangularjsforms
J. Chett
J. Chett

Reputation: 69

Angular JS disabled/enable submit button for edit form onchange

I am making an app where I have an edit form. I have the save button start disabled, then when something is typed into the form, the button is enabled (did this using $dirty).

The issue is once the form is "saved" (which is really submitting the info to the database) the button does not go back to being disabled.

<button ng-click="saveThis(item)" ng-disabled="!formy_edit.$dirty" id="save_button">Save</button>

I tried disabling it on the submit of the form like this:

 <button ng-click="saveThis(item)" ng-disabled="!formy_edit.$dirty || formy_edit.$submitted">Save</button>

But then the feature to disable-enable only works 1 time since the form is already submitted of course.

Could use some help/guidance, Thanks!!

Upvotes: 0

Views: 684

Answers (2)

Syed
Syed

Reputation: 269

Instead of $dirty and $submitted, try this out:

ng-disabled="!(!!user.name && !!user.email)"

Check out this example : https://plnkr.co/edit/59mvzN2RwNmb1yDOCskv?p=preview

Upvotes: 0

Akashii
Akashii

Reputation: 2281

You shoud set form pristine after submitted . Try this : 

 $scope.saveThis= function(item,form) { //name of form
  $http.post('..').then(function(){
form.$setPristine();   
})
}

Upvotes: 0

Related Questions