<select> only shows first char of selected option

Question

I have a standard select box which I\'m populating using jquery by appending options, but for some reason IE9 only shows the first character of the selected option. Needless

Answer 1

I've just fixed the same issue by changing how the select element was being initialised (dynamically created within a jQuery widget).

Example A

This doesn't work:

var select = $('') // IE9 'first character' bug


This does:

var select = $('').attr('size', 7) // Yay

Example B

Similarly, the following doesn't work:

self.element.append(''); // IE9 'first character' bug


Whereas this will:

var mySelect = $('').attr('name', 'mySelect');
self.element.append(mySelect);

Conclusion

I'd love to be able to explain the above but I'm afraid I can't. Regardless, this might save folk from adding a bunch of CSS hacks to their code unnecessarily.