John Higgins
John Higgins

Reputation: 907

reset multiple form fields with AngularJS

I am using the following code to reset a form field using a checkbox with AngularJS.

<input type="text" ng-model="data.test" ng-disabled="data.check">

<input type="checkbox" 
ng-change="data.test = data.check ? '' : data.test"
ng-model="data.check" 
value="one">

How would I use this code to reset multiple form fields?

Thanks,

John

Upvotes: 1

Views: 628

Answers (2)

Pandiyan Cool
Pandiyan Cool

Reputation: 6565

Store the data in separate array and validator in another variable

<input type="text" ng-model="data.test" ng-disabled="clear.check">
<input type="text" ng-model="data.test_another" ng-disabled="clear.check">

<input type="checkbox" ng-change="data = clear.check ? {} : data"
ng-model="clear.check" value="one">

Once you want to reset the form data, you can directly assign empty array set to form data array

Upvotes: 1

damjtoh
damjtoh

Reputation: 385

You can use $setPristine() for resetting the field state.

HTML:

<form name="myForm">

    <input type="text" ng-model="data.test" ng-disabled="data.check">
    <input type="text" ng-model="data.test2" ng-disabled="data.check">
    <input type="checkbox" 
    ng-change="reset()"
    ng-model="data.check" 
    value="one">
</form>

JS:

$scope.resetForm = function() {
    $scope.data = {
        "test": "",
        "test2": ""
    };
    // 'myForm' is the name of the <form> tag.
    $scope.myForm.$setPristine();
}

Upvotes: 0

Related Questions