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;
        });
    };

Just set this.newcustomer ={}.

charlietfl
– charlietfl

2016-06-02 12:05:27 +00:00
Commented Jun 2, 2016 at 12:05 — charlietfl
– charlietfl, Commented Jun 2, 2016 at 12:05
$scope.customer={};

user2517610
– user2517610

2016-06-02 12:06:24 +00:00
Commented Jun 2, 2016 at 12:06 — user2517610
– user2517610, Commented Jun 2, 2016 at 12:06
@charlietfl, it didnt work

Arif YILMAZ
– Arif YILMAZ

2016-06-02 12:06:38 +00:00
Commented Jun 2, 2016 at 12:06 — Arif YILMAZ
– Arif YILMAZ, Commented Jun 2, 2016 at 12:06
Show some relevant html for your ng-models

charlietfl
– charlietfl

2016-06-02 12:07:07 +00:00
Commented Jun 2, 2016 at 12:07 — charlietfl
– charlietfl, Commented Jun 2, 2016 at 12:07
Duplicate of stackoverflow.com/questions/13085024/…?

Wagner Danda da Silva Filho
– Wagner Danda da Silva Filho

2016-06-02 12:11:18 +00:00
Commented Jun 2, 2016 at 12:11 — Wagner Danda da Silva Filho
– Wagner Danda da Silva Filho, Commented Jun 2, 2016 at 12:11

DarkSkull · Accepted Answer · 2016-06-02 12:06:42Z

1

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;
        });
    };

answered Jun 2, 2016 at 12:06

DarkSkull

1,1153 gold badges13 silver badges23 bronze badges

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

1 Comment

charlietfl Over a year ago

this is not what you think it is. Different context in the callback

Renan Willian · Accepted Answer · 2016-06-02 12:09:41Z

-3

You have to manually clear the values of the form elements

This should do it:

delete $scope.newcustomer

answered Jun 2, 2016 at 12:09

Renan Willian

213 bronze badges

Collectives™ on Stack Overflow

How to reset form after submit in AngularJS

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related