<SELECT>NN all IE all HTML all  

<SELECT>...</SELECT>

HTML End Tag: Required  

The select element displays information from nested option elements as either a scrolling list or pop-up menu in a document. Users typically make a selection from the list of items (or multiple selections from a scrolling list if the size attribute is set greater than 1 and the multiple attribute is set). The value attribute of the selected option item is submitted as the value part of a name/value pair to the server with a form. When the element is set to allow multiple selections, multiple ampersand-delimited name/value pairs (repeating the name of the element) are submitted with the form. Navigator 4 requires that a select element be placed inside a form element.

 
Example
  
<SELECT name="chapters">
    <OPTION value="chap1.html">Chapter 1</OPTION>
    <OPTION value="chap2.html">Chapter 2</OPTION>
    <OPTION value="chap3.html">Chapter 3</OPTION>
    <OPTION value="chap4.html">Chapter 4</OPTION>
</SELECT>
 
Object Model Reference
  
[window.]document.formName.selectName
[window.]document.forms[i].elements[j]
[window.]document.getElementById(elementID)
 
Element-Specific Attributes
 
accesskeyaligndataflddatasrcdisabled
multiplenamesizetabindex
 
Element-Specific Event Handler Attributes
 
HandlerNNIEHTML
onafterupdaten/a4n/a
onbeforeupdaten/a4n/a
onchange234
accesskeyNN n/a IE 4 HTML n/a  

accesskey="character"

Optional  

This widely shared attribute is listed here to remind you that only IE supports the attribute for the select element. See the discussion among the shared attributes earlier in this chapter.

alignNN n/a IE 4 HTML n/a  

align="alignmentConstant"

Optional  

Determines how the rectangle of the select element (particularly when the size attribute is set greater than 1) aligns within the context of surrounding content. See Section 8.1.5 earlier in this chapter. Note that only Internet Explorer supports the align attribute for the select element.

 
Example
  
<SELECT name="chapters" multiple align="baseline">...</SELECT>
 
Value

Case-insensitive constant value.
 
Default

bottom (IE/Windows); absmiddle (IE/Macintosh).

 
Object Model Reference
  
[window.]document.formName.selectName.align
[window.]document.forms[i].elements[j].align
[window.]document.getElementById(elementID).align
datafldNN n/a IE 4 HTML |4|  

datafld="columnName"

Optional  

Used with IE data binding to associate a remote data source column name to the selectedIndex property of a select element (i.e., a zero-based index value of the item currently selected in the list, as described in the select object of Chapter 9). As such, you can use data binding only with select elements that do not specify the multiple attribute. A datasrc attribute must also be set for the element. Works only with text file data sources in IE 5/Mac.

This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
 
Example
  
<SELECT name="chapters" datasrc="DBSRC3" datafld="chapterRequest">
    <OPTION value="chap1.html">Chapter 1</OPTION>
    <OPTION value="chap2.html">Chapter 2</OPTION>
    <OPTION value="chap3.html">Chapter 3</OPTION>
    <OPTION value="chap4.html">Chapter 4</OPTION>
</SELECT>
 
Value

Case-sensitive identifier.
 
Default

None.
 
Object Model Reference
  
[window.]document.formName.selectName.dataFld
[window.]document.forms[i].elements[j].dataFld
[window.]document.getElementById(elementID).dataFld
datasrcNN n/a IE 4 HTML |4|  

datasrc="dataSourceName"

Optional  

Used with IE data binding to specify the ID of the page's object element that loads the data source object for remote data access. Content from the data source is specified via the datafld attribute. Works only with text file data sources in IE 5/Mac.

This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
 
Example
  
<SELECT name="chapters" datasrc="#DBSRC3" datafld="chapterRequest">
    <OPTION value="chap1.html">Chapter 1</OPTION>
    <OPTION value="chap2.html">Chapter 2</OPTION>
    <OPTION value="chap3.html">Chapter 3</OPTION>
    <OPTION value="chap4.html">Chapter 4</OPTION>
</SELECT>
 
Value

Case-sensitive identifier.
 
Default

None.
 
Object Model Reference
  
[window.]document.formName.selectName.dataSrc
[window.]document.forms[i].elements[j].dataSrc
[window.]document.getElementById(elementID).dataSrc
disabledNN 6 IE 4 HTML 4  

disabled

Optional  

The presence of this attribute disables the entire select element and its nested option elements. The element receives no events when it is disabled. You can also disable individual options through those elements' disabled properties.

 
Example
  
<SELECT name="chapters" disabled>
    <OPTION value="chap1.html">Chapter 1</OPTION>
    <OPTION value="chap2.html">Chapter 2</OPTION>
    <OPTION value="chap3.html">Chapter 3</OPTION>
    <OPTION value="chap4.html">Chapter 4</OPTION>
</SELECT>
 
Value

The presence of this attribute sets its value to true.

 
Default

false
 
Object Model Reference
  
[window.]document.formName.selectName.disabled
[window.]document.forms[i].elements[j].disabled
[window.]document.getElementById(elementID).disabled
langNN 3 IE 4 HTML 4  

lang="languageCode"

Optional  

The language being used for the element's attribute values and content. A browser can use this information to assist in proper rendering of content with respect to details such as treatment of ligatures (when supported by a particular font or required by a written language), quotation marks, and hyphenation. Other applications and search engines might use this information to aid the selection of spell-checking dictionaries and the creation of indices.

 
Example
  
<SPAN lang="de">Deutsche Bundesbahn</SPAN>
 
Value

Case-insensitive language code.
 
Default

Browser default.
 
Object Model Reference
  
[window.]document.getElementById(elementID).lang
multipleNN all IE all HTML all  

multiple

Optional  

The presence of the multiple attribute instructs the browser to render the select element as a list box and to allow users to make multiple selections from the list of options. By default, the size attribute is set to the number of nested option elements, but the value may be overridden with the size attribute setting. Users can select contiguous items by Shift-clicking on the first and last items of the group. To make discontiguous selections, Windows users must Ctrl-click on each item; Mac users must Command-click on each item. The multiple attribute has no effect when size is set to 1 to display a pop-up menu.

 
Example
  
<SELECT name="equipment" multiple>
    <OPTION value="monitor">Video monitor</OPTION>
    <OPTION value="modem">Modem</OPTION>
    <OPTION value="printer">Printer</OPTION>
    ...
</SELECT>
 
Value

The presence of this attribute sets its value to true.

 
Default

false
 
Object Model Reference
  
[window.]document.formName.selectName.multiple
[window.]document.forms[i].elements[j].multiple
[window.]document.getElementById(elementID).multiple
[window.]document.formName.selectName.type
[window.]document.forms[i].elements[j].type
[window.]document.getElementById(elementID).type
nameNN all IE all HTML all  

name="elementIdentifier"

Optional  

The name submitted as part of the element's name/value pair with the form. It is similar to the name attribute of input elements.

 
Example
  
<SELECT name="cpu" id="cpu">
    <OPTION value="486">486</OPTION>
    <OPTION value="pentium">Pentium</OPTION>
    <OPTION value="pentium2">Pentium II</OPTION>
    ...
</SELECT>
 
Value

Case-sensitive identifier.
 
Default

None.
 
Object Model Reference
  
[window.]document.formName.selectName.name
[window.]document.forms[i].elements[j].name
[window.]document.getElementById(elementID).name
sizeNN all IE all HTML all  

size="rowCount"

Optional  

Controls the number of rows of option elements that appear in the select element. With a value of 1, the select element displays its content as a pop-up menu; with a value greater than 1, option items are rendered in a list box. Browsers control the width of the element, based on the widest text associated with nested option elements.

 
Example
  
<SELECT name="equipment" size="3">
    <OPTION value="monitor">Video monitor</OPTION>
    <OPTION value="modem">Modem</OPTION>
    <OPTION value="printer">Printer</OPTION>
    ...
</SELECT>
 
Value

Any positive integer.
 
Default

1
 
Object Model Reference
  
[window.]document.formName.selectName.size
[window.]document.forms[i].elements[j].size
[window.]document.getElementById(elementID).size
tabindexNN 6 IE 4 HTML 4  

tabindex="integer"

Optional  

This shared attribute is listed here to remind you that Netscape 6 and HTML 4 support it to facilitate accessibility to a complex form control. Once the select element has focus, the user can continue using the keyboard to make item choices. See the discussion about this attribute earlier in this chapter.