html Optgroup Tag

In the html <optgroup> tag is used to group data options in a select list.All main browsers are supported in <optgroup> tag. If you have long list at select box use to <optgroup> tag for grouping data and it easily understand for user.In the <optgroup> tag label attribute is used to label for the option group and disabled attribute is used to disabled for <optgroup> tag.

The <optgroup> tag required attributes is label and optional attributes is disabled and standard attributes are class, dir, id, lang, style, title and xml:lang.


   <option> ... </option>

Example Code

   <optgroup label="Alphabetical Letter">
   <option value ="sydney"> A </option>
   <option value ="melbourne"> B </option>
   <option value ="melbourne"> C </option>
   <optgroup label="Numeric Numbers">
   <option value ="cromwell"> 1 </option>
   <option value ="queenstown"> 2 </option>
   <option value ="queenstown"> 3 </option>
   <optgroup label="Symbols">
   <option value ="cromwell"> + </option>
   <option value ="queenstown"> - </option>
   <option value ="queenstown"> * </option>

Out Put:

In the above select list example <optgroup> tag has been added to Alphabetical Letter,Numeric Numbers and can not select <optgroup> options.