Text boxes

Some of the most common features of forms are single line text boxes. You can type information into the box, for example, a name, credit card number or an e-mail address.

If you want several lines, use the <textarea> tag instead.

To set up a single line text box, you use the <input> tag and set the type attribute to text. For example:

The size attribute specifies the width of the text box in characters. Additionally, you can also use the maxlength attribute to define the number of characters that a user can enter in the box. If this is greater than the size, the field will scroll.

You might want to restrict the size and maximum for two reasons:

• Most text fields are designed for values of a specific length, for example a telephone number or a postcode. If you limit the size, you cut down the user’s chance of entering the wrong information
• To make the length of the field the same as the length your script handles

Text fields are, by default, empty but you can use the value attribute to set an initial value. The browser displays the value in the text field on the form. The use can change this by typing over it.

You can also use the name attribute to add an internal name to the field so the program that handles the form can identify the fields.