I am attempting to use server side validation and show them in the view.
Currently form submits, I get my error JSON response:
{"first_name":["Please enter your first name."],"last_name":["Please enter your
last name."],"email":["Please enter your email."],"password":["The password
field is required."]}
As a side not there will only be 1 error per field displayed, so it will
not be Please enter name, Name must be longer than 3 chars, Name can not
contain number or anything like that.
and flowing various guides I managed to get it working to a point. But what
happens is the form errors are never cleared if corrected and re-submitted,
and the actual form HTML gets the errors in the class:
*Pre submit HTML:*
<form class="form-horizontal ng-pristine ng-valid ng-valid-email"
novalidate="" ng-submit="register()" role="form" name="form">
*AFTER SUBMIT:* Notice the injection of the errors!
<form class="form-horizontal ng-pristine ng-valid-email ng-submitted
ng-invalid ng-invalid*-please enter your first name. last ng-invalid-the
password field is required.*" novalidate="" ng-submit="register()"
role="form" name="form">
Form fields HTML look like:
<div class="form-group" ng-class="errorClass('first_name')">
<label for="first_name" class="col-sm-2
control-label">Firstname</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="first_name"
placeholder="Firstname" ng-model="first_name">
<span class="help-block" ng-show="form.first_name.$invalid &&
form.first_name.$dirty">{{errorMessage('first_name')}}</span>
</div>
</div>
JS Error Code functions:
function failure(response) {
angular.forEach(response, function(errors, key) {
angular.forEach(errors, function(e) {
$scope.form[key].$dirty = true;
$scope.form[key].$setValidity(e, false);
});
});
}
$scope.errorClass = function(name) {
var s = $scope.form[name];
return s.$invalid && s.$dirty ? "error" : "";
};
$scope.errorMessage = function(name) {
var s = $scope.form[name].$error;
result = [];
angular.forEach(s, function(key, value) {
result.push(value);
});
return result.join(", ");
};
How can I remove the errors, error class when submitted again, if error
occurs display it again.
And what is going on with the error description getting pushed into the
<form> its-self?
Thanks all.
Dave
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
