The select element allows the user to select between a pre-defined range of elements. It comes in two different forms: A dropdown list or a listbox. This behavior is controlled by the multiple attribute, as described below. Here's an example of the select element, rendered as a dropdown list:

 

 

Select person... John Doe Jane Doe

 

Each element in the select box is generated by using an option tag, like this:

 

<select name="Persons"> 
     <option>Select person...</option> 
     <option>John Doe</option> 
     <option>Jane Doe</option> 
</select>

The multiple attribute

A standard select list only allows the selection of one option, but what if we wanted our user to be able to select more than one? That's exactly what the boolean multiple attribute is for. Here's an example:

 

<select name="Persons" multiple="multiple"> 
     <option>Anyone</option> 
     <option>John Doe</option> 
     <option>Jane Doe</option> 
</select>

The result will look like this:

 

Anyone John Doe Jane Doe

 

Select one item by clicking it, and more items by holding down the <Ctrl> or <Shift> key on your keyboard while clicking.

 

© htmlpedia.net 2008 - 2012