IE9 and <select/>, why u no work?

By Jaaap on Wednesday 02 November 2011 17:55 - Comments (6)
Category: -, Views: 3.221

Ok i understand this horse has been beaten to death far too many times but...

It is so frustrating to work with <select/>'s in IE.

Let's try this for instance:

JavaScript:
1
2
var sel = document.getElementsByTagName("select")[0];
alert(sel === sel.options);

This is false in every browser (as it should be) except IE(9)!

This means that if you have a function that accepts HTMLElements AND NodeLists, there is no way of distinguishing between a select and its options in IE.

Let's try something else:

HTML:
1
2
3
4
5
<select name="make">
    <optgroup label="Alfa Romeo">
        <option>Giulietta</option>
    </optgroup>
</select>


Now try to change the optgroup label's font-style to normal (it's bold and italic).
Cannot be done! How do you explain that to a customer?

Please Microsoft, fix these issues.

Volgende: Fun with input[type=range], hsl colors and CSS gradients 03-'12 Fun with input[type=range], hsl colors and CSS gradients
Volgende: Block shady SSL certificates 08-'11 Block shady SSL certificates

Comments


By Tweakers user hellfighter87, Wednesday 02 November 2011 18:16

I have no idea if this works bu tthis is the first thing i this whas the first thing that popt into my head

document.getElementsByTagName("select")[0].innerHTML..getElementsByTagName("optgroup").SomethingToSetTheFontStyle

By Tweakers user BillsGate, Wednesday 02 November 2011 19:06

How do you explain that to a customer?
If something isn't possible, it just isn't possible. If you can't explain that to your customer, that's not Microsofts fault. ;)

Don't get me wrong, as a web developer IE can be nasty, but you have got to give Microsoft some credit for getting closer to the standards with each version of IE they release. Twelve more versions and developing for IE is as easy as it is for other browsers. :+

As a solution, give a framework like jQuery, with the interface of jQueryUI a chance. (www.jqueryui.com)

By Tweakers user Gamebuster, Thursday 03 November 2011 09:18

CSS?

Also, try Chosen JS lib

By Tweakers user onok, Thursday 03 November 2011 11:14

Jquery will indeed solve your problems. And styling an OptGroup label works fine here, even in IE8.

By Tweakers user Jaaap, Thursday 03 November 2011 11:22

onok wrote on Thursday 03 November 2011 @ 11:14:
And styling an OptGroup label works fine here, even in IE8.
Are you sure you can set the font-style and the font-weight of an optgroup lalbel in IE?

By Tweakers user Magnetra, Thursday 03 November 2011 14:19

Please <select>another browser</select>.

Comments are closed