Nesting optgroups in a dropdownlist/select

Answer 1

I think if you have something that structured and complex, you might consider something other than a single drop-down box.

Answer 2

I think it's not a fact of complexity. For example: I've got the same problem and I just want to display nested categories to which other elements can be assigned to. It's only for readability that they should be indented or something like that.

Answer 3

The HTML spec here is really broken. It should allow nested optgroups and recommend user agents render them as nested menus. Instead, only one optgroup level is allowed. However, they do have to say the following on the subject:

Note. Implementors are advised that future versions of HTML may extend the grouping mechanism to allow for nested groups (i.e., OPTGROUP elements may nest). This will allow authors to represent a richer hierarchy of choices.

And user agents could start using submenus to render optgoups instead of displaying titles before the first option element in an optgroup as they do now.

Answer 4

This is just fine but if u add option witch is not in optgroup it gets buggy.

<select>
       <optgroup label="Level One">
         <option> A.1 </option>
         <optgroup label="nbsp;nbsp;nbsp;nbsp;Level Two">
          <option>nbsp;nbsp;nbsp;nbsp; A.B.1 </option>
         </optgroup>
         <option> A.2 </option>
        </optgroup>

        <option> A </option>

</select>

would be much better if u used css and close optgroup right away :

<select>
    <optgroup label="Level One"></optgroup>
     <option style="padding-left:15px"> A.1 </option>
     <optgroup label="Level Two" style="padding-left:15px"></optgroup>
      <option style="padding-left:30px"> A.B.1 </option>    
     <option style="padding-left:15px"> A.2 </option>
    <option> A </option>
</select>