innerhtml - best way to reset a form using jquery -


i have following javascript , html form:

<!doctype html> <html> <head>     <meta http-equiv="content-type" content="text/html; charset=utf-8">     <title></title>     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>      <!--<script src="./_js/jquery-1.7.2.min.js"></script>-->     <script>          // wait dom loaded          $(document).ready(function() {              $("#clear_form").click(function(){                    var resetforms = function () {                     $('form').each(function() {                         this.reset();                     }); // end earch                  }; // end var resetforms                  resetforms();   // ************edit based on questions responses *************                  var x = document.getelementbyid("all_clear");                  x.innerhtml = '';   // *** still not working *** ** //******************** end edit based on responses *****************                });// end clear form               $("#t_form").submit(function(){                 var user_input = $("#u_input").val();                 $.ajax({                       type: "post",                       url: "response.php",                       datatype: 'json',                       data: {email: user_input},                       success: function(msg){                           $("#all_clear").replacewith(msg.email);                       }, // end success                        error: function(requestobject, error, errorthrown) {                         alert(error);                         alert(errorthrown);                       } // end error                 });// end ajax             }); // end submit            });// end ready      </script>  </head> <body>     <form id="t_form" onsubmit="return false;">     <p>email: <input id="u_input" type="text" value="your email"></p>     <p id="first">click button when done.</p>     <br />     <input type="submit" name="submit" class="button" id="submit_btn" value="send" />     <input type="submit" anme="reset" class="button" id="clear_form" value="clear form" />     <br />     <p id="all_clear"></p>     </form>  </body> </html> 

when click 'clear form' button, user input field resets, not <p id="all_clear"></p>

i'm trying whole form reset.

edit still not working after changes above.

i noticed when click 'clear form' button, ajax request firing server.

so, removed "clear form" button form (in html) , used getelementbyid 1 of other answers , whole thing works. it's not at, learning tool.

<!doctype html> <html> <head>     <meta http-equiv="content-type" content="text/html; charset=utf-8">     <title></title>     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>      <!--<script src="./_js/jquery-1.7.2.min.js"></script>-->     <script>          // wait dom loaded          $(document).ready(function() {              $("#clear_form").click(function(){                   var x = document.getelementbyid("all_clear");                 x.innerhtml = '';                  var resetforms = function () {                     $('form').each(function() {                         this.reset();                     }); // end earch                  }; // end var resetforms                  resetforms();              });// end clear form              $("#t_form").submit(function(){                 var user_input = $("#u_input").val();                 $.ajax({                       type: "post",                       url: "response.php",                       datatype: 'json',                       data: {email: user_input},                       success: function(msg){                           var new_message = msg.email;                           var x = document.getelementbyid("all_clear");                           x.innerhtml = msg.email;                       }, // end success                        error: function(requestobject, error, errorthrown) {                         alert(error);                         alert(errorthrown);                       } // end error                 });// end ajax             }); // end submit           });// end ready      </script>  </head> <body>      <form id="t_form" onsubmit="return false;">     <p>email: <input id="u_input" type="text" value="your email"></p>     <p id="first">click button when done.</p>     <br />     <input type="submit" name="submit" class="button" id="submit_btn" value="send" />     </form>       <input type="submit" anme="reset" class="button" id="clear_form" value="clear form" />     <br />     <p id="all_clear"></p> </body> </html> 

Popular posts from this blog

How to calculate SNR of signals in MATLAB? -

c# - Attempting to upload to FTP: System.Net.WebException: System error -

ios - UISlider customization: how to properly add shadow to custom knob image -