When working with HTML Forms, a Cancel button is sometimes handy when you want to reset a form. It deletes the user’s input and displays the same form again. This is particularly helpful to users that want to reset a form from scratch and start with a new form entry.
Here’s a simple HTML page called “form.html” that uses the “post” form method and uses an action to itself – the same page which is “form.html.” The form also contains a Cancel button which will be rendered using the input markup below. Notice the input type is set to “submit.”
Cancel Button To Reset Form
<html> <head> <title>Form</title> </head> <body> <form method="post" action="form.html"> <label for="firstname">Firstname:</label><br/> <input type="text" name="firstname" value="" /> <input type="submit" name="submit" value="Submit" /> <input type="submit" name="cancel" value="Cancel" /> </form> </body> </html>
Redirect With The Cancel Button
<input type="button" name="cancel" value="Cancel" onclick="window.location='anyfile.html'" />