Appending options to a select

Question

This is related to Adding options to a <select> using jQuery? but has a different focus

My problem is that I am not able to append option-elements to a select in IE8. When changing the engine to IE7 in IE's developer-tools it does work.

It also works in FF and Chrome.

var valT = "some Text";
var charsToIgnore = 2;

var o = new Option(valT.slice(charsToIgnore), valT);
$(o).html(valT.slice(charsToIgnore));
$('#availablePages').append(o);

another method I tried:

$('<option/>', {value: valT, text: valT}).appendTo("#availablePages");

availablePages is the id of my select. The select does not contain any elements when the page is received by the client. My doctype is <!DOCTYPE html>.

I also tried to remove all other scripts and css from my site to make sure no side-effects apply.

Edit:\ Thanks for downvoting! It's not my fault if provided solutions do not work in all IE8-versions. Since my question was What DOES work in all IE8-versions? it is, from my point of view, understandable that I do not accept answers which do not work for me. As you can see in Adding options to a <select> using jQuery? I am not the only one for whom the other replies here do not work. Using the Up-/Down-Vote functionalities as channel for your own mood is no good Wiki/QA-behaviour.

`$(o).html(valT.slice(charsToIgnore));` <-- that line seems redundant, since `new Option("a", "b");` already returns `` — Cerbrus, Feb 15 '13 at 13:52

score 1 · Answer 1 · answered Feb 15 '13 at 13:55

1

This should just do the trick for you:

$('#availablePages').append(new Option(valT.slice(charsToIgnore), valT));

(Tested and working in IE8)

answered Feb 15 '13 at 13:55

Cerbrus

70,800
18
132
147

does not work for me :( Which exact version of IE are you running? I'm running 8.0.6001 – Gundon Feb 15 '13 at 14:16
IE 9 in IE 8 compatibility mode, actually. But that shouldn't be different. Are you certain `$('#availablePages')` exists? – Cerbrus Feb 15 '13 at 14:22
Yup. As said, it also works in other browsers + IE8 in IE7-mode. There is also no other script-code left on that site – Gundon Feb 15 '13 at 14:31

score -1 · Accepted Answer · answered Feb 15 '13 at 14:55

What worked for me

  var o = new Option("option text", "value");
  $(o).html("option text");  // Without this line it does not work..
  $("#availablePages").append(o);

What I also had to change / what one should consider:

display: table; is NOT allowed to be applied. For some reason it breaks everything.

Appending options to a select

2 Answers2