This is part 5 of HTML Form series. You can read previous parts here. In this part you will learn about reset button control in HTML form.
The reset
input type creates a button that resets the form to the default values.
If the value
attribute is present, the value of that attribute will be the text on the button. If not, the default wording on the reset button is “Reset”.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>input type reset button</title>
</head>
<body>
<form>
<label>User id: </label>
<input type="text" name="user-id" value="user">
<label>Password: </label>
<input type="password" name="pass" value="pass"><br><br>
<input type="submit" value="login">
<input type="reset" value="Reset">
</form>
</body>
</html>
Try to change the input values of user id and password, then when you click on reset, it will reset input fields with default values.