Summary -
In this topic, we described about the <select> tag along with detailed example.
Form control option selection or simply drop down list for user selection. The <select> tag used to create the drop down lost for user selection. <select> element is mostly used in conjunction with <option> element.
<select> tag contains option elements can be grouped in optgroup elements. The tag can be specified like <select value=""></select> with the options in between the opening and closing.
Syntax -
<select>.... </select>
Optional Attributes -
Attribute | Description | Values |
---|---|---|
autofocus | Specifies the drop down list automatically get focused when page loads.HTML5 attribute | autofocus |
disabled | Specifies the drop-down list should be disabled.HTML5 attribute | Disabled |
form | Specifies the select field belongs form name | Form_id |
multiple | Specifies the multiple options can be selected at once | Multiple |
name | Specifies the name of the drop down list | Name |
required | Specifies the user selection is mandatory before submitting the form.HTML5 attribute | Required |
size | Specifies the number of visible options in drop-down list | Number. |
Example -
<!DOCTYPE html>
<html>
<head>
<title>select tag example.. </title>
</head>
<body>
Select week from the list:
<select>
<option value="monday">Monday</option>
<option value="tuesday">Tuesday</option>
<option value="wednesday">Wednesday</option>
<option value="thursday">Thursday</option>
<option value="friday">Friday</option>
<option value="saturday">Saturday</option>
<option value="sunday">Sunday</option>
</select>
</body>
</html>
Output:
Select week from the list: