I have taken a look at the following: Reset Form in AngularJS and Angular clear subform data and reset validation from these I am trying to create a dynamic form reset/clear function which would look like something like the following:
$scope.clearSection = function(formName){
$scope.formName.$setPristine();
$scope.formName.$setUntouched();
};
Is it possible to create a dynamic clear function like this in angular where the form name is dynamically passed to this function?
Example plunkr: http://plnkr.co/edit/lnGym0vKsANL6oks30RG
$scope.resetForm = function(formName) {
var form = $scope[formName];
form.$setUntouched();
form.$setPristine();
}
Note: You still need to reset the input values!
According to the docs:
https://docs.angularjs.org/api/ng/type/form.FormController
$setPristine(); Sets the form to its pristine state.
This method can be called to remove the 'ng-dirty' class and set the form to its pristine state (ng-pristine class). This method will also propagate to all the controls contained in this form.
Setting a form back to a pristine state is often useful when we want to 'reuse' a form after saving or resetting it.
$setUntouched(); Sets the form to its untouched state.
This method can be called to remove the 'ng-touched' class and set the form controls to their untouched state (ng-untouched class).
Setting a form controls back to their untouched state is often useful when setting the form back to its pristine state.
$setPristine and $setUntouched only change the classes of the form controls, not the values. That means you still need to reset the values.
I don't see why not.
$scope.clearSection = function(formName){
var frm = $scope[formName];
frm.$setPristine();
frm.$setUntouched();
};
Well yes.
In JavaScript you can access variables of an object using the [] notation. Take the following example
var str = 'hello';
var obj = { hello: 'a' };
console.info(obj[str]); // outputs 'a'
so if formName is a string, you can simply get the property of the scope using
var form = $scope[formName]
