setpristine setdirty formcontrol form error dirty angularjs

setdirty - AngularJs. $ SetPristine para restablecer el formulario



formcontrol angular js (6)

He estado luchando para restablecer el formulario una vez que se envía la forma. Alguien publicó esto Here y quiero que funcione, pero sin éxito. Aquí está mi ejemplo de Mi código .

$scope.form.$setPristine(); no está configurando Pristine: {{user_form.$pristine}} como verdadero . Vea el ejemplo de arriba.



Hay otra forma de prístina forma que es enviar formulario al controlador. Por ejemplo:-

En vista:-

<form name="myForm" ng-submit="addUser(myForm)" novalidate> <input type="text" ng-mode="user.name"/> <span style="color:red" ng-show="myForm.name.$dirty && myForm.name.$invalid"> <span ng-show="myForm.name.$error.required">Name is required.</span> </span> <button ng-disabled="myForm.$invalid">Add User</button> </form>

En el controlador: -

$scope.addUser = function(myForm) { myForm.$setPristine(); };


Resolví el mismo problema de tener que restablecer un formulario en su estado prístino en la versión angular 1.0.7 (no $ setPristine method)

En mi caso de uso, el formulario, luego de ser llenado y enviado, debe desaparecer hasta que sea necesario llenar otro registro. Así que hice el efecto mostrar / ocultar usando ng-switch en lugar de ng-show. Como sospechaba, con ng-switch, el subárbol de DOM de formulario se elimina por completo y luego se vuelve a crear. Entonces el estado prístino se restablece automáticamente.

Me gusta porque es simple y limpio, pero puede que no sea adecuado para el caso de uso de nadie.

también puede implicar algunos problemas de rendimiento para las formas grandes (?) En mi situación, no me enfrenté a este problema todavía.


Solo para aquellos que quieren obtener $setPristine sin tener que actualizar a v1.1.x, esta es la función que utilicé para simular la función $setPristine . Estaba reacio a usar v1.1.5 porque uno de los componentes de AngularUI que utilicé no es compatible.

var setPristine = function(form){ if(form.$setPristine){//only supported from v1.1.x form.$setPristine(); }else{ /* *Underscore looping form properties, you can use for loop too like: *for(var i in form){ * var input = form[i]; ... */ _.each(form, function (input) { if (input.$dirty) { input.$dirty = false; } }); } };

Tenga en cuenta que SÓLO hace que los $dirty campos $dirty estén limpios y ayuda a cambiar la condición de "mostrar error" como $scope.myForm.myField.$dirty && $scope.myForm.myField.$invalid .

Otras partes del objeto de formulario (como las clases css) aún deben tenerse en cuenta, pero esto resuelve mi problema: ocultar los mensajes de error.


Tuve un problema similar, en el que tuve que volver a establecer el formulario como prístino, pero también como no modificado, ya que $ invalid y $ error se usaron para mostrar los mensajes de error. Solo usar setPristine () no fue suficiente para borrar los mensajes de error.

Lo resolví usando setPristine () y setUntouched (). (Consulte la documentación de Angular: https://docs.angularjs.org/api/ng/type/ngModel.NgModelController )

Entonces, en mi controlador, utilicé:

$scope.form.setPristine(); $scope.form.setUntouched();

Estas dos funciones restablecen el formulario completo a $ pristine y de nuevo a $ intocable, de modo que se borraron todos los mensajes de error.


La respuesta de DavidLn me ha funcionado en el pasado. Pero no captura todas las funcionalidades de setPristine, lo que me hizo tropezar esta vez. Aquí hay una cuña más completa:

var form_set_pristine = function(form){ // 2013-12-20 DF TODO: remove this function on Angular 1.1.x+ upgrade // function is included natively if(form.$setPristine){ form.$setPristine(); } else { form.$pristine = true; form.$dirty = false; angular.forEach(form, function (input, key) { if (input.$pristine) input.$pristine = true; if (input.$dirty) { input.$dirty = false; } }); } };