AngularJs setPristine to reset form

Question

I been struggling to reset form once form is submitted  Someone posted this Here which I want to make it work but no success  Here is my My Code Example    scope form  setPristine    is not setting Pristine    user form  pristine   to true  See example above

User · Answer

DavidLn s answer has worked well for me in the past  But it doesn t capture all of setPristine s functionality  which tripped me up this time  Here is a fuller shim   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

User · Answer

setPristine   was introduced in the 1 1 x branch of angularjs   You need to use that version rather than 1 0 7 in order for it to work    See http   plnkr co edit 815Bml p preview

User · Answer

I solved the same problem of having to reset a form at its pristine state in Angular version 1 0 7  no  setPristine method   In my use case  the form  after being filled and submitted must disappear until it is again necessary for filling another record  So I made the show hide effect by using ng-switch instead of ng-show  As I suspected  with ng-switch  the form DOM sub-tree is completely removed and later recreated  So the pristine state is automatically restored   I like it because it is simple and clean but it may not be a fit for anybody s use case   it may also imply some performance issues for big forms     In my situation I did not face this problem yet

User · Answer

Just for those who want to get  setPristine without having to upgrade to v1 1 x  here is the function I used to simulate the  setPristine function  I was reluctant to use the v1 1 5 because one of the AngularUI components I used is no 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                                       Note that it ONLY makes  dirty fields clean and help changing the  show error  condition like  scope myForm myField  dirty  amp  amp   scope myForm myField  invalid    Other parts of the form object  like the css classes  still need to consider  but this solve my problem  hide error messages

User · Answer

There is another way to pristine form that is by sending form into the controller  For example -  In view -   lt form name  myForm  ng-submit  addUser myForm   novalidate gt       lt input type  text  ng-mode  user name   gt        lt span style  color red  ng-show  myForm name  dirty  amp  amp  myForm name  invalid  gt         lt span ng-show  myForm name  error required  gt Name is required  lt  span gt       lt  span gt        lt button ng-disabled  myForm  invalid  gt Add User lt  button gt   lt  form gt    In Controller -   scope addUser   function myForm           myForm  setPristine

User · Answer

Had a similar problem  where I had to set the form back to pristine  but also to untouched  since  invalid and  error were both used to show error messages  Only using setPristine   was not enough to clear the error messages   I solved it by using setPristine   and setUntouched     See Angular s documentation  https   docs angularjs org api ng type ngModel NgModelController   So  in my controller  I used    scope form setPristine      scope form setUntouched      These two functions reset the complete form to  pristine and back to  untouched  so that all error messages were cleared

[angularjs] AngularJs .$setPristine to reset form

Examples related to angularjs