How to reset form after submit in AngularJS

Question

I am new to AngularJS and trying to do a project. I have a form which works perfectly. However, there is only one thing that I should do. After adding a customer, I need to clear the form. Because, when the user wants to add a second customer, tthe user sees the previously entered values.

$scope.add = function () {
        $scope.loading = true;
        $http.post('/api/Customer/', this.newcustomer).success(function (data) {
            alert("Added Successfully!!");
            $scope.addMode = false;
            $scope.customers.push(data);
            $scope.loading = false;

        }).error(function (data) {
            $scope.error = "An Error has occured while Adding Customer! " + data;
            $scope.loading = false;
        });
    };

Duplicate of http://stackoverflow.com/questions/13085024/reset-a-model-with-angular-js? — Wagner Danda da Silva Filho, Jun 02 '16 at 12:11

score 1 · Accepted Answer · answered Jun 02 '16 at 12:06

Try this:

$scope.add = function () {
        $scope.loading = true;
        $http.post('/api/Customer/', this.newcustomer).success(function (data) {
            alert("Added Successfully!!");
            $scope.addMode = false;
            $scope.customers.push(data);
            $scope.loading = false;
            this.newcustomer = {};

        }).error(function (data) {
            $scope.error = "An Error has occured while Adding Customer! " + data;
            $scope.loading = false;
        });
    };

`this` is not what you think it is. Different context in the callback — charlietfl, Jun 02 '16 at 12:07

score -3 · Answer 2 · answered Jun 02 '16 at 12:09

-3

You have to manually clear the values of the form elements

This should do it:

delete $scope.newcustomer

answered Jun 02 '16 at 12:09

Renan Willian

21
3

How to reset form after submit in AngularJS

2 Answers2