How to reset a form using jQuery

In this tutorial, we are going to see how to reset a form using jQuery. You can simply use the trigger() method to trigger JavaScript’s reset() method, as shown in the example below.

How to reset a form using jQuery

<!DOCTYPE html>
<html>
	<head>
		<title>Reset a form using jQuery</title>
		<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
		<script>
			$(document).ready(function(){
				$(".reset").click(function(){
					$("#frm").trigger("reset");
				});
			});
		</script>
	</head>
	<body>
		<form action="run.php" method="post" id="frm">
			<p><label>Firstname:</label> <input type="text" name="firstname"></p>
			<p><label>Lastname:</label> <input type="text" name="lastname"></p>
			<p><label>Address:</label> <input type="text" name="address"></p>
		</form>
		<button type="button" class="reset">Reset form</button>
	</body>
</html>

Result
Firstname: Lastname: Address:

How to reset a form using jQuery

You May Also Like

Auto-update DIV content while typing in textarea with jQuery

How to Check If a Value is Numeric or Not in jQuery

How to loop through array with jQuery.each()?

Leave a Reply Cancel reply