<input type="reset">

<input> elements of type "reset"  are rendered as reset buttons — clicking one will reset all the inputs in the form it is part of to their initial values.

<input type="reset" value="Reset the form">

Value

An <input type="reset"> elements' value attribute contains a DOMString that is used as the button's label.

<input type="reset" value="Reset the form">

If you don't specify a value, you get an button with the default label Reset:

<input type="reset">

Using reset buttons

<input type="reset"> buttons are used to reset forms. If you want to create a custom button and then customize the behaviour using JavaScript, you need to use <input type="button">, or better still, a <button> element.

A simple reset button

We'll begin by creating a simple reset button:

<form> 
  <div>
    <label for="example">Type in some sample text</label>
    <input id="example" type="text">
  </div>
  <div>
    <input type="reset" value="Reset the form">
  </div>
</form>

This renders like so:

Try entering some text into the text field, and then pressing the reset button.

Adding a reset keyboard shortcut

Keyboard shortcuts, also known as access keys and keyboard equivalents, let the user trigger a button using a key or combination of keys on the keyboard. To add a keyboard shortcut to a reset button — just as you would with any <input> for which it makes sense — you use the accesskey global attribute.

In this example, r is specified as the access key (you'll need to press r plus the particular modifier keys for your browser/OS combination; see accesskey for a useful list of those).

<form>
  <div>
    <label for="example">Type in some sample text</label>
    <input id="example" type="text">
  </div>
  <div>
    <input type="reset" value="Reset the form"
     accesskey="r">
  </div>
</form>

Disabling and enabling a reset button

To disable a reset button, simply specify the disabled global attribute on it, like so:

<input type="reset" value="Disabled" disabled>

You can enable and disable buttons at run time by simply setting disabled to true or false; in JavaScript this looks like btn.disabled = true.

Validation

Buttons don't participate in constraint validation; they have no real value to be constrained.

Examples

We've included simple examples above. There isn't really anything more to say about reset buttons. 

Specifications

Browser compatibility

See also

• <input> and the HTMLInputElement interface which implements it.
• The <button> element.