Here’s something I learnt last week, just as the title says: how to group items in an (x)HTML select drop down list. This trick, which I’d assumed was done with magic (or rather DHTML or JavaScript trickery), is actually very easy to achieve being straight forward HTML markup.

[Found in a referenced post linked to by Laura Carlson’s excellent [webdev] reference pages (subscribe to the list server here)…]

…the secret, as explained by “Web Teacher” here, is simply to wrap the items you want to group ┬áin the select list with

<optgroup label="group_title"> and </optgroup>

Another good point made there is that to make a select list multiple choice you just need to add the attribute multiple="multiple" into the opening select tag (and make it clear to the users that this is the case as well as how to actually select mulitiple items…)

Last updated on 5th September 2018