CODEWITHSUNDEEP
javascriptinternet-explorerinnerhtml
Dr.Knowitall
Dr.Knowitall

Reputation: 10508

Adding option elements using .innerHTML in IE

I have a txt variable that contains my html string that I need to set for a drop down list. The code works fine in all the other browsers except for IE. The basic code is shown below.

while loop with some more code

document.getElementById('theSelector').innerHTML = txt;

where 'theSelector' is the id of my select element for my form

So basically IE poops out and doesn't generate my list. I'll post my webpage below if you'd like to look at the source and everything that I'm doing. If you want to see how the site should function just run it in another browser that's not ie.

http://1wux.com/Resume/signUp.html

Upvotes: 5

Views: 11758

Answers (3)

John Adel
John Adel

Reputation: 181

use Jquery

$('#theSelector').html(txt);

Upvotes: -1

ThinkingStiff
ThinkingStiff

Reputation: 65391

As others have mentioned, this is a bug in all version of IE. I would use @AdamRackis's solution, but if you must build your HTML with string, the only workaround seems to be use outerHTML and include your <select> in the string.

Demo: http://jsfiddle.net/ThinkingStiff/TWYUa/

HTML:

<select id="select"></select>

Script:

var options = '<select id="select"><option>one</option><option>two</option></select>';
document.getElementById( 'select' ).outerHTML = options;

Upvotes: 4

Adam Rackis
Adam Rackis

Reputation: 83376

Based on your comment that it isn't generating your list, and Jared's comment that you're trying to add options, try something like this:

var list = document.getElementById('theSelector');
var newOp = document.createElement("option");
newOp.text = "Txt";
newOp.value = "1";
list.options.add(newOp);

EDIT

Per Jared's comment, the following may offer you a bit of a performance advantage:

list.options[list.options.length] = newOp;

Upvotes: 4

Related Questions