Cooking with JavaScript & DHTML
Subject:   <optgroup&rt; support?
Date:   2004-12-05 22:53:46
From:   dannyg1
Response to: support?

It might be possible depending on how rigid your page needs to validate (X)HTML.

Key lines to modify would be:

var selectOptions = selectElem.options;


txt = selectOptions[i].text.toUpperCase();

The righthand side of the first statement would be changed to return all optgroup elements of the select tag (selectElem.getElementsByTagName("optgroup")). The righthand side of the second statement would be changed to read the id attribute of the optgroup (assuming you assign the keyed word(s) to each optgroup's id attribute).

That leaves what you do with the typeahead. Since the optgroup elements themselves are not selectable, you'll have to decide if the desired user interface is to select the first nested option. If so, you'll need to have a correlation somewhere between a particular optgroup element and the index value of its first nested option within the select element (i.e., to set the select element's selectedIndex property). You could do a custom attribute of the optgroup elements (thus breaking traditional validation), or perhaps create a pseudo-hash table which the typeahead function uses for lookup whenever it finds a match of the optgroup's id.

I don't know if this making any sense (I don't know your scripting skill level), and I haven't tried to implement my suggestions. But it's where I'd start to attack the problem.

1 to 1 of 1
  1. <optgroup> support?
    2004-12-05 22:55:28  Danny Goodman | O'Reilly Author [View]

1 to 1 of 1