An HTML Select list is a form control used to create a drop-down list of items from which the user can select. Each item in a select list is defined by an option element. The most basic code for an HTML select list is shown below.
<select> <option>Item 1</option> <option>Item 2</option> <option>Item 3</option> </select>
Some Useful Select List Attributes
The selected attributes causes an option to be selected by default.
<select> <option value="Bread">Bread</option> <option value="Coffee">Coffee</option> <option value="Fruit" selected="selected">Fruit</option> <option value="Pie">Pie</option> <option value="Salad">Salad</option> <option value="Soup">Soup</option> <option value="Wine">Wine</option> </select>
The multiple attribute allows the user to select multiple items in the list. Note: the user must press and hold the [Ctrl] key while selecting multiple items.
<select multiple="multiple"> <option value="Bread">Bread</option> <option value="Coffee">Coffee</option> <option value="Fruit">Fruit</option> <option value="Pie">Pie</option> <option value="Salad">Salad</option> <option value="Soup">Soup</option> <option value="Wine">Wine</option> </select>
The size attribute sets the number of items that will be visible in the list.
<select size="3"> <option value="Bread">Bread</option> <option value="Coffee">Coffee</option> <option value="Fruit">Fruit</option> <option value="Pie">Pie</option> <option value="Salad">Salad</option> <option value="Soup">Soup</option> <option value="Wine">Wine</option> </select>
Using a Select List
When the user selects one of the items in a select list, an onchange event is triggered. The selectedIndex property will then contain the index of the item that the user selected. Select list option indexes start with 0 for the first item.
More HTML Code:
• HTML Image Basics
• Text Input Box Basics
• HTML Linking Basics
• The HTML Head Tag
• Easy Form Design
• How to Debug HTML
• Easy Code to Add Google Site Search to Your Website
• Using del and ins Tags to Mark Up Editing on HTML Page
• Code For a Basic 2-Column Fluid Webpage Layout
• Divide a Table Into Head (thead), Body (tbody), and Footer (tfoot) Sections