views:

933

answers:

2

We determined in a previous question that many features of HTML SELECTs are not supported in IE. Is there an alternative widget that you would recommend from your experience that meets the following requirements?

  1. Respects the contentEditable property (does not allow selection changes if true)
  2. Respects the disabled property of individual OPTIONs (shows them "grayed out" or with strike-through font, and makes them un-selectable)
  3. Supports Option Groups (OPTGROUP elements)
  4. Supports style options such as border and margin in the SELECT and all sub-elements
  5. Supports dynamic add and delete of OPTION and OPTGROUP elements
  6. Supports the above in IE version 6 and above

EDIT: As noted by @Joel Coehoorn, items 3 and 5 above are currently supported in IE. They are included here to make sure they are not overlooked in a replacement widget.

+2  A: 

At last check IE6+ does support #3 and #5, and you can (mis)use OPTGROUP to work around most of the other items.

You can do this by having an optgroup with no options inside it, like this:

<optgroup label="--"></optgroup>

You can make the label anything you want, but the point is that you'll end up with an item that looks like a normal option, but cannot be selected. That opens to the door to all kinds of fun:

  • You can disable specific items by adding them as optgroups
  • You can prevent selection changes by encoded all options but the current one as optgroups (use some other text key to indicate they are disabled, if you need to)
  • You can use blank, --, or &mdash; labels to indicated simple separators rather than whole groups.

That accounts for most of #1 & #2 in your list, anyway- at least the functional points.

The reason for "(mis)use" is because this won't pass most html validators. However, the trick does work on all major browsers.

Joel Coehoorn
I agree with #3 and #5. Can you suggest how to (mis)use OPTGROUP to work around the others?
Ken Paul
Thank you, Joel. That gives me plenty to start playing with. Meanwhile, I'd encourage (challenge?) anyone to implement an independent widget that met the listed criteria, and share it with us.
Ken Paul
Challenge someone to write the code for you? Lazy ass!
Vince
+1  A: 

I am writing such a widget. I plan to implement optgroup in my next version, which will be in a few days hopefully, since ive been making good progress.

demo page

svn

mkoryak