SELECT - Option Selector

The SELECT element defines a form control for the selection of options. While SELECT is most useful within a FORM, HTML 4.0 allows SELECT in any block-level or inline element other than BUTTON. However, Netscape Navigator will not display any SELECT elements outside of a FORM.

The SELECT element contains one or more OPTGROUP or OPTION elements to provide a menu of choices for the user. Each choice is contained within an OPTION element. Choices can be grouped logically through the OPTGROUP element. SELECT's NAME attribute provides the key sent to the server with the value of the selected option.

By default, the user can only select one option. The boolean MULTIPLE attribute allows the user to select multiple options, which are submitted as separate name/value pairs. The following example uses the MULTIPLE attribute to allow the selection of one or more options:

<P>Select one or more sections to search:
<SELECT NAME=sections MULTIPLE>
<OPTION>Web Authoring Reference</OPTION>
<OPTION>FAQ Archives</OPTION>
<OPTION>Design Elements</OPTION>
<OPTION>Tools</OPTION>
<OPTION>Feature Article</OPTION>
</SELECT>
</P>

The boolean DISABLED attribute, new in HTML 4.0 and poorly supported by current browsers, makes the SELECT element unavailable. The user is unable to edit the disabled selection, no value is submitted with the form, the SELECT element cannot receive focus, and the element is skipped when navigating the document by tabbing.

The TABINDEX attribute specifies a number between 0 and 32767 to indicate the tabbing order of the element. A SELECT element with TABINDEX=0 or no TABINDEX attribute will be visited after any elements with a positive TABINDEX. Among positive TABINDEX values, the lower number receives focus first. In the case of a tie, the element appearing first in the HTML document takes precedence.

The SIZE attribute of SELECT hints that visual browsers should display the element as a list box with the specified number of options visible at any time. A scroll bar would allow access to any non-visible options. The SIZE attribute is especially useful in SELECT elements with numerous OPTIONs and multiple selections allowed. In such a situation, some visual browsers will render the entire list in one large box without scrolling; a suitable SIZE attribute helps such browsers give a more appropriate presentation.

The SELECT element also takes a number of attributes to specify client-side scripting actions for various events. In addition to the core events common to most elements, SELECT accepts the following event attributes:

• ONFOCUS, when the element receives focus;
• ONBLUR, when the element loses focus;
• ONCHANGE, when the element loses focus and its value has changed since it received focus.

More Information

• SELECT in W3C HTML 4.0 Recommendation
• SELECT in W3C HTML 3.2 Recommendation
• SELECT in HTML 2.0 Standard
• SELECT in WDG HTML 3.2 Reference
• SELECT in Learning HTML 3.2 by Examples

Copyright © 1998 by Liam Quinn. This material may be distributed only subject to the terms and conditions set forth in the Open Publication License, v1.0 or later (the latest version is presently available at http://www.opencontent.org/openpub/).