Reset form after submit using Angular js

Question

I want to reset form fields after submitting the form my code is working fine but here for clearing input field I wrote like this all checkbox fields all checkbox fields I have to write.

$scope.appointmentForm = function() {
$scope.formData = {};
$http({
    method: "POST",
    url: "appointment_mail.php",
    data: {
        date: $scope.appt_date,
        fname: $scope.fname,
        lname: $scope.lname,
        email: $scope.email,
        notes: $scope.notes,
        services: $scope.services,
        category: $scope.category,
        address: $scope.address,
        timings: $scope.appt_timings,
        phone: $scope.phone,
        services: $scope.services,
        category: $scope.category
    },
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    }
}).then(function(response) {
    data = response.data;
    if (!data.success) {
        // if not successful, bind errors to error variables
        $scope.errorFname = data.errors.fname;
        $scope.errorLname = data.errors.lname;
        $scope.errorMail = data.errors.email;
        $scope.errorPhone = data.errors.phone;
        $scope.errorNotes = data.errors.notes;
        $scope.errorAddress = data.errors.address;
        $scope.messages = null;
    } else {
        // if successful, bind success message to message
        $scope.fname = '';
        $scope.lname = '';
        $scope.email = '';
        $scope.note = '';
        $scope.address = '';
        $scope.phone = '';
        $scope.appointment_form.$setPristine();
        $scope.messages = data.messages;
        $timeout(function() {
            // Loadind done here - Show message for 3 more seconds.
            $timeout(function() {
                $scope.messages = false;
            }, 3000);
        }, 2000);
        //From here is there any other alternative way
        $scope.category = {
            "red": "",
            "blue": "",
            "green": "",
        }
        $scope.services = {
            "abc": "",
            "xyz": "",
        }
        $scope.appt_timings = "";
        $scope.notes = "";
        $("#iva_apptdate").datepicker('setDate', null);
    }
}, function(error) {});
}
});
<div class="check-wrap">
  <div class="cat">
    <span class="checkbox">
      <input type="checkbox" name="category" checked data-ng-model="iva_category.red">                                                               
      <label>Red
      </label>
    </span>
  </div>
  <div class="cat">
    <span class="checkbox">
      <input type="checkbox" name="category" data-ng-model="category.blue">
      <label>Blue
      </label>
    </span>
  </div>
  <div class="cat">
    <span class="checkbox">
      <input type="checkbox" name="category" data-ng-model="category.green">
      <label>Green/label>
        </span>
      </div>
  </div>

My question is there any alternate way to do this because here i have to write more code to clear checkbox input fields.Feel free to tell if anything wrong.

This should be useful https://stackoverflow.com/questions/21571370/resetting-form-after-submit-in-angularjs — TechnoCrat, Jun 27 '18 at 08:35
You should enclose you form in a `form` tag then use this: https://docs.angularjs.org/guide/forms. There is an example of a reset functionality. Please, do not use jQuery or DOM maniupulation as proposed in the answer below. — ssougnez, Jun 27 '18 at 08:35

Reset form after submit using Angular js

0 Answers0