<INPUT>

The input element is used to create form inputs that allow a user to enter information on a web page and then submit this information to the server. There are many different types of input elements that you can use to compose a web form. Understanding each type is important to create usable forms.

<INPUT TYPE="button">

The button input is used to create a push button on the screen. These buttons do nothing on their own. However, when you attach an event using the onclick handler, you can make a button perform custom actions including but not limited to a form post action.

<INPUT TYPE="checkbox">

The checkbox input creates a checkbox that may be checked or unchecked. In the checked state, the checkbox will pass the value specified by the value attribute. In the unchecked state, the checkbox passes no value.

If you create multiple checkboxes with the same name, the form will pass an array of values for the name specified. The passed form values should be handled using server-side scripting.

<INPUT TYPE="hidden">

A hidden input is used to pass a form value without displaying any visible form input on the screen. This is useful for passing parameters from one page to the next. It is a good alternative to passing values in the query string component of the URL since it hides the parameter from the user.

<INPUT TYPE="radio">

A radio button input displays a button with a label next to it. If the button is marked with a black circle, its value is passed to the server. If the button is cleared the value will not be passed.

If you create multiple radio buttons with the same name, the form will only allow one button to be selected at a time. We say that the options are mutually exclusive because only one can be chosen from the group at any time. In this scenario, we are guaranteed that only one value gets passed for the input name.

<INPUT TYPE="reset">

A reset input is a special type of push button which allows a user to reset all of the form values to their initial state. Although this input initially seemed useful, it has been more of a nuisance than a help. This is because users might accidently hit the reset button after taking all of the time to fill out a long form. We don't advise using this element on your web forms.

<INPUT TYPE="submit">

A submit input is a special type of push button which allows a user to submit a form to the server. A submit button may have a special javascript handler using the onclick event. If the onclick method returns a value of false, the form submit will be canceled. This allows a programmer to do special form validation before a form is submitted.

<TEXTAREA> and <SELECT>

Two other inputs that are covered elsewhere are the TEXTAREA and SELECT input. These create a multi-line text box and a selection list respectively.

Attributes

Attribute Description ID Identifies this tag to reference in script (program code) CLASS Define the class used to render this element (defined by a style sheet) TITLE A title that is associated with the element (displayed as a tooltip in Internet Explorer) NAME Defines the name that will be used to reference this element in the Document Object Model (DOM) TYPE Must be defined as BUTTON for this type of input VALUE Defines the label which is affixed to the button and is displayed to the user DISABLED Presence of this attributes indicates the button cannot be clicked TABINDEX Indicates the "tab order" for keyboard navigation of the web page input controls

Example

<BUTTON NAME="submit" VALUE="submit" TYPE="submit">Sample Button</BUTTON>

Sample Button

Compatibility

HTML 4.01