Platinum Edition Using HTML 4, XML, and Java 1.2
(Publisher: Macmillan Computer Publishing)
Author(s): Eric Ladd
ISBN: 078971759x
Publication Date: 11/01/98

<OPTGROUP>

Type:

Container

Function:

Defines a logical group of select list options.

Syntax:

<OPTGROUP LABEL=”label_text” DISABLED>
<OPTION> ... </OPTION>
<OPTION> ... </OPTION>
<OPTION> ... </OPTION>
...
</OPTGROUP>

Attributes:

<OPTGROUP> can take two attributes:

•  DISABLED—Disables the options in the group.

•  LABEL—Specifies a label for the option group.

Example:

<OPTGROUP LABEL=”months”>
<OPTION VALUE=”Jan”>January</OPTION>
<OPTION VALUE=”Feb”>February</OPTION>
<OPTION VALUE=”Mar”>March</OPTION>
...
</OPTION>

Related Tags:

The <OPTGROUP> tag should be used only inside the <SELECT> and </SELECT> tags. The only tag allowable inside the <OPTGROUP> and </OPTGROUP> tags is the <OPTION> tag.

<TEXTAREA>

Type:

Container

Function:

Sets up a multiple-line text input window.

Syntax:

<TEXTAREA NAME=”field_name” ROWS=”number_of_rows”
  COLS=”number_of_columns” DISABLED READONLY
  ACCESSKEY=”shortcut_key_letter” TABINDEX=”tab_position”>
... default text to appear in window ...
</TR>

Attributes:

The <TEXTAREA> tag can take the following attributes:

•  ACCESSKEY—Defines a shortcut key combination that the user can press to give focus to the text input window (see the attribute listing for the <A> tag for more details).

•  COLS—Set equal to the number of columns wide the text window should be.

•  DISABLED—Deactivates the text window.

•  NAME—Assigns a unique name to the input window so that the processing program can identify it.

•  READONLY—Leaves the window active, but the user will not be able to change the default text that is displayed.

•  ROWS—Set equal to the number of rows high the text window should be.

•  TABINDEX—Defines the text window’s position in the tabbing order of the page.

Example:

<TEXTAREA NAME=”feedback” ROWS=10 COLS=40>
We appreciate your comments!  Please delete this
text and type in your feedback.
</TEXTAREA>

<BUTTON>

Type:

Container

Function:

Places a button on the form. This type of button is different from the one rendered by <INPUT> because it has improved presentation features, such as three-dimensional rendering and up/down movement when clicked.

Syntax:

<BUTTON TYPE=”SUBMIT|RESET|BUTTON” NAME=”button_name” VALUE=”button_value”
  DISABLED ACCESSKEY=”shortcut_key_letter” TABINDEX=”tab_position”>
... text for button face or <IMG> tag ...
</BUTTON>

If text is placed between the <BUTTON> and </BUTTON> tags, that text will appear on the face of the button. If an <IMG> tag is placed between <BUTTON> and </BUTTON>, the image will be used as the button.

Attributes:

You can use the following attributes with the <BUTTON> tag:

•  ACCESSKEY—Defines a shortcut key combination that the user can press to click the button (see the attribute listing for the <A> tag for more details).

•  DISABLED—Disables the button.

•  NAME—Gives the button a unique name.

•  TABINDEX—Defines the button’s position in the tabbing order of the page.

•  TYPE—Set to SUBMIT, RESET, or BUTTON, depending on the type of button you’re defining. TYPE=”BUTTON” is typically used for defining a scripted button.

•  VALUE—Specifies what is passed to the server when the button is clicked.

Example:

<BUTTON NAME=”validate” VALUE=”form_validation” onClick=”validate();”>
Click here to validate your input.
</BUTTON>

<LABEL>

Type:

Container

Function:

Denotes a form field label. Labels are typically text next to the field that prompts the user for the type of input expected. This works fine for text-based browsers, but it makes forms inaccessible for users who are visually impaired and who use speech-based or Braille browsers. Marking field labels with the <LABEL> tag makes it possible to prompt these users for the necessary input.

Syntax:

<LABEL FOR=”field_ID” ACCESSKEY=”shortcut_key_letter”>
... label text goes here ...
</LABEL>

Attributes:

The <LABEL> tag takes the following attributes:

•  ACCESSKEY—Defines a shortcut key combination that the user can press to give focus to the label (see the attribute listing for the <A> tag for more details).

•  FOR—Set equal to the value of the ID attribute for the field that goes with the label.

Example:

<LABEL FOR=”PW” ACCESSKEY=”P”>Enter your password:</LABEL>
<INPUT TYPE=”PASSWORD” ID=”PW” NAME=”passwd”>

Related Tags:

<LABEL> is typically used with the <INPUT>, <SELECT>, or <TEXTAREA> tags.

<FIELDSET>

Type:

Container

Function:

Groups related form input fields.

Syntax:

<FIELDSET>
... related input fields ...
</FIELDSET>

Attributes:

None.

Example:

<FIELDSET>
Login: <INPUT TYPE=”TEXT” NAME=”login”>
Password: <INPUT TYPE=”PASSWORD” NAME=”passwd”>
</FIELDSET>

Related Tags:

The <LEGEND> tag can be used to give a field grouping a specific name.

<LEGEND>

Type:

Container

Function:

Names a group of related form fields.

Syntax:

<LEGEND ALIGN=”LEFT|RIGHT|TOP|BOTTOM” ACCESSKEY=”shortcut_key_letter”>
... legend text goes here ...
</LEGEND>

Attributes:

The <LEGEND> tag has two attributes:

•  ACCESSKEY—Defines a shortcut key combination that the user can press to give focus to the legend (see the attribute listing for the <A> tag for more details).

•  ALIGN—Controls how the legend text is horizontally aligned with respect to the group of fields and can be set equal to LEFT, RIGHT, TOP, or BOTTOM.ALIGN has been deprecated in favor of using style sheet information to align a legend.

Example:

<FIELDSET>
<LEGEND ALIGN=”TOP”>User Login Information</LEGEND>
Login: <INPUT TYPE=”TEXT” NAME=”login”>
Password: <INPUT TYPE=”PASSWORD” NAME=”passwd”>
</FIELDSET>

Related Tags:

<LEGEND> gives a name to a set of fields grouped together by the <FIELDSET> tag.