<option>
<option> Tag
The <option> tag in HTML defines options within a <select> element or as part of an <optgroup>. It represents a single selectable choice in a dropdown list or a grouped selection.
Syntax
<select>
<option value="value1">Option 1</option>
<option value="value2" selected>Option 2</option>
<option value="value3">Option 3</option>
</select>
<option> Demo
<select>
<option value="apple">Apple</option>
<option value="banana">Banana</option>
<option value="cherry" selected>Cherry</option>
</select>
Attributes
| Attribute | Value | Description |
|---|---|---|
disabled | disabled | Disables the option, making it unselectable |
label | text | Defines a brief label for the option |
value | text | Represents the data submitted to the server |
disabled: Prevents the option from being selected, often appearing grayed out. If its parent<optgroup>is disabled, all its child options will be disabled as well.label: Specifies a label for the option. If omitted, the option’s text content is used as the label.value: Defines the data sent to the server when this option is selected. If omitted, the text inside the option is submitted.
Definition and Purpose
The <option> tag represents a selectable item in a dropdown or selection list.
It is used within <select>, <optgroup>, or <datalist> elements to provide user-selectable options.
<option> tag works without attributes, the value attribute is often used to define the data that will be submitted when the form is sent.<optgroup> tag to group related options, making selection easier.See Also
- Other form-related elements:
<form> <legend> <label> <button> <select> <datalist> <optgroup> <fieldset> <textarea> <input> <output> <progress> <meter>
Conclusion
The <option> tag is essential for defining selectable items in dropdown lists within <select>, <optgroup>, or <datalist> elements. It allows for attributes like value to control behavior and data submission. The value attribute ensures that the correct data is sent to the server. Additionally, using <optgroup> helps organize and simplify long lists of options.
<optgroup>
The HTML <optgroup> element organizes related <option> elements within a <select> dropdown, creating a structured and grouped list of choices.
<output>
The HTML <output> element shows the result of a user action or calculation, such as data generated by form inputs or scripts, allowing for the display of dynamic content.