Overview

One of forms’ basic functions is to allow users to type in their own input, such as name, email address, comments, etc. The TEXT=”type” attribute and TEXTAREA tag provide this capability.

The TEXT type

For most text input, you will use the <input> tag, with a TYPE=”text” attribute. Use another attribute, NAME, to uniquely identify each text field in your form.

For example:

Your full name <input type="text" name="fullname">

Produces the following:

Your full name

As we have seen, the <input> tag can be used for several different form components, each distinguished by its own TYPE.

The TEXT type has two optional attributes: SIZE, which is roughly the width of the entry box in characters (default is 20), and MAXLENGTH, which sets a limit to the number of characters that can be entered in the field.

<textarea> tag

While the TEXT type is best used for small, one-line input fields. The <textarea> tag is appropriate for multiple-line text input fields that may accommodate several words, sentences or paragraphs. A TEXTAREA requires both opening and closing tags. Any text between these tags will be used as default text within the TEXTAREA:

<textarea name="comments">Enter comments here.</textarea>

Produces this:

The TEXTAREA tag specifies sizing with the COLS and ROWS attributes. COLS (columns) is roughly the number of characters you can type on a horizontal line. This specification varies greatly between different browsers and platforms, so it is best to test it on several machines. The ROWS specification is simply the height in lines of the text input box.

Another attribute, WRAP, specifies how lines should break. The default for many browsers is “none,” which results annoyingly in text that starts scrolling off past the right edge of the entry box. You should set this attribute either to “physical,” which will force automatic line breaks at the edge of the entry box, or “virtual,” which does the same thing except that no actual line breaks are sent with the form data.

This example uses both TEXT type and TEXTAREA fields, with several attributes:

First name: <input type="text" name="firstname" size="15" maxlength="12"> <br>
 Last name: <input type="text" name="lastname" size="15"> <br>
Email: <input type="text" name="email_address"> <br>
Comments: <textarea name="comments" cols="40" rows="6" wrap="physical"> </textarea> <br>

…to produce this result:

First name:

Last name:

Email:

Comments: