In this tutorial we will see How To Display Message On Form Reset. onreset Event is used for this purpose which occurs when the html form is reset.
Table of Contents
HTML Code
HTML Code is given below. In this code we have used onreset Event for the input type reset element.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Display Message On Form Reset</title>
</head>
<body>
<form onreset="msg()">
<label>Name: </label><input type="text" placeholder="Name:">
<br><br>
<label>Cell #: </label><input type="number" placeholder="Number:">
<input type="reset">
</form>
<script>
function msg() {
alert("The form has been reset!");
}
</script>
</body>
</html>
input type="reset"
input type="reset" defines a reset button which can reset all form fields.
input type="reset" is supported by all major browsers.
<!DOCTYPE html>
<html>
<head>
<title>input type="reset"</title>
<meta charset="utf-8">
</head>
<body>
<form>
<input type="reset">
</form>
</body>
</html>
onreset Event
onreset event occurs when a form is reset.
onreset event is supported by all major browsers.
In this example a simple JavaScript function is executed on reset event, to display the message.
Video Tutorial
Watch video tutorial on How To Display Message On Form Reset.