Clever Geek Handbook

AngularJS how to disable button after click

Hi I have a form with some inputs like email, title, color ...

I have two buttons "Save" and "Discard changes".

I need these buttons to be always disabled if something is changed. For example, I started to change my email address and then I thought. While I'm typing the new email buttons, you should be enabled, but after clicking on one of them, they should be disabled again.

<form name="form" ng-submit="change()" novalidate>
    <input type="text" ng-model="title"/>
    <input type="email" name="email" ng-model="email" placeholder="{{email}}" />
    <input type="color" ng-model="color"/>

    <button type="submit" ng-disabled="!form.$dirty">SAVE</button>
    <a ng-click="cancel()" ng-disabled="!form.$dirty">UNDO CHANGES</a>
</form>

How can I turn them off after pressing one of the buttons?

+3


source to share


2 answers


Call $scope.form.$setPristine()

to discard all dirty flags:

function TodoCtrl($scope) {

    $scope.change = function() {
        $scope.form.$setPristine();
    }

    $scope.cancel = function() {
        $scope.form.$setPristine();
    }
}


Example: http://jsfiddle.net/ej5et0f5/1/

+1


source


Just create a flag variable that you set to true after submit and to false after changing the input, and then just do:



<button type="submit" ng-disabled="flagVariable">
+1


source






More articles:


All Articles