How to Reset a Form Using jQuery or JavaScript
reset()
You can simply use the JavaScript reset() method to reset a web form.
Let's take a look at the following example to understand how it basically works:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Reset Form Using JavaScript</title> <script> function resetForm() { document.getElementById("myForm").reset(); } </script> </head> <body> <form action="/examples/html/action.php" method="post" id="myForm"> <label>First Name:</label> <input type="text" name="first-name"> <input type="submit" value="Submit"> </form> <br> <button type="button" onclick="resetForm();">Custom Reset Button</button> </body> </html>
In jQuery there is no method like reset(), however you can use the jQuery trigger() method to trigger the JavaScript native reset() method, like this:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Reset Form Using jQuery</title> <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script> $(document).ready(function(){ $(".reset-btn").click(function(){ $("#myForm").trigger("reset"); }); }); </script> </head> <body> <form action="/examples/html/action.php" method="post" id="myForm"> <label>First Name:</label> <input type="text" name="first-name"> <input type="submit" value="Submit"> </form> <br> <button type="button" class="reset-btn">Custom Reset Button</button> </body> </html>
total answers (1)
start bookmarking useful questions and collections and save it into your own study-lists, login now to start creating your own collections.
Use the
reset()MethodYou can simply use the JavaScript
reset()method to reset a web form.Let's take a look at the following example to understand how it basically works:
In jQuery there is no method like reset(), however you can use the jQuery trigger() method to trigger the JavaScript native reset() method, like this:
need an explanation for this answer? contact us directly to get an explanation for this answer