Submit and reset buttons

You can set up submit and reset buttons. The submit button sends the information on the form to the server for processing. The reset button resets all the form elements to their original values. You should always try to provide a reset button in your forms, so that users who get confused or enter the wrong information can simply hit the reset button and start again.

A submit button

To create a submit button in a form, you use the <input> tag with the type attribute set to submit:

To change the label on the button to something more useful, use the value attribute:

When you press this button, the browser sends your form data to the server but it doesn't tell the server which button you clicked. If you want the server to know this, you need to add the name attribute. For example:

<form>
  <input type="submit" value="Order Now!" name="order">
</form>

If you press the Order Now! button, the browser passes a parameter named order to your script with its value set to "Order Now!." In your program, you check the value of order to know what to do with the form data.

If you want to master forms, make sure you understand how to create submission buttons, alter their appearance, and enable them to transmit their value to the server to control the form processing.

A reset button

You create a reset button with the <input> tag, of course, but you must set the type attribute to reset. For example:

<form>
<input type="reset">
</form>

Like a submission button, you can change the text in a reset button:

<form>
<input type="reset" value="Start Again">
</form>