Reset form to initial values in AngularJS [duplicate]

Question

Is it possible to reset a form to it's initial values in AngularJS?

I have a simple form with a field with ng-model='my_object.my_value', which is disabled. When I start editing it, I copy $scope.my_object to $scope.my_object_backup.

If I click cancel, I disable the field and set $scope.my_object = $scope.my_object_backup. But the value I see in my input doesn't change.

Is there a way to got around this behavior?

I tried setting value="{{my_object.my_value}}" but it doesn't change anything.

Basically the exact same question: stackoverflow.com/questions/13085024/… — Marcel Gwerder
– Marcel Gwerder, Commented Aug 8, 2013 at 20:08

zs2020 · Accepted Answer · 2013-08-08 20:20:23Z

7

You can use angular.copy to deep copy the object

$scope.my_object_backup = {};
angular.copy($scope.my_object, $scope.my_object_backup);

What you did $scope.my_object_backup = $scope.my_object is make reference assignment so they actually point to the exacly same object. So, if you modify via one reference, you will access to the modified object via the other reference.

edited Aug 8, 2013 at 20:20

answered Aug 8, 2013 at 20:09

zs2020

54.7k30 gold badges157 silver badges223 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Samuel Bolduc Over a year ago

Wow, I tried this first (like in the docs) but it always reset to null so I thought it was not good and went with $scope.my_object_backup = $scope.my_object... I tried again like you said, and noticed my $scope.my_object_backup was initialized with null... I changed it to new Object() and it works like a charm!

Collectives™ on Stack Overflow

Reset form to initial values in AngularJS [duplicate]

1 Answer 1

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Linked

Related