9.0 Forms
While most HTML elements are used for structuring content and controlling layout, forms add a degree of interactivity to websites. Just like with regular paper forms, they allow visitors to a site to enter some requested information and then submit it for processing. Here are some of the tags used with forms:
| Tag | Purpose |
|---|---|
| <form> | Defines a form for user input |
| <input> | Defines an input field |
| <textarea> | Defines a multi-line text input area |
| <label> | Defines a label to a control |
| <fieldset> | Defines a fieldset |
| <legend> | Defines a caption for a fieldset |
| <select> | Defines a selectable list (a drop down box) |
| <optgroup> | Defines an option group |
| <option> | Defines an option in a drop down box |
| <button> | Defines a push button |
A form is defined using the <form> tag but also contains other elements, such as the <input> tag, which allow users to enter information. The basic layout of a form using these two tags is:
<form>
<input>
</input>
</form>
The input tag is one of the most used form tags. It allows visitors to input requested data. Note that at this stage the form itself will not be visible. To achieve something more we need to introduce some useful attributes for the input tag:
| Input Attributes | Purpose |
|---|---|
| type | Determines the type of input field. Choices are text (default), password, radio, checkbox, button, submit and reset (file, hidden, and image are also available). |
| name | Assigns a name to a given input field so that it may be referenced later. |
| size | Sets the horizontal width of the input field (measured in blank spaces). |
| maxlength | Sets the maximum number of characters that may be input. |
| value | Specifies what will be sent if the user chooses a selection (such as a radio button). Only one value will be sent for a given group. |
The next few pages will deal with the various choices available for the type attribute.