I have a page that sets the length of a select list to 0 before it adds new options. This worked fine in all browsers until IE9. In IE9 I get the error: DOM Exception: NOT_FOUND_ERR (8). This is all I'm trying to do:

var typebox = document.sForm.ePosition;
typebox.options.length = 0;

Works fine in patibility mode.

I have a page that sets the length of a select list to 0 before it adds new options. This worked fine in all browsers until IE9. In IE9 I get the error: DOM Exception: NOT_FOUND_ERR (8). This is all I'm trying to do:

var typebox = document.sForm.ePosition;
typebox.options.length = 0;

Works fine in patibility mode.

• javascript
• internet-explorer-9

• 2 So basically you're trying to remove all the elements of a select box before adding items? If so, that's not the best way to go about it. – Tejs Commented Aug 22, 2011 at 19:30
• 2 Ok. Give me some pointers. What is another way to go about it? – Tom Commented Aug 22, 2011 at 19:34
• See @Seth's answer; you should remove the elements via code. – Tejs Commented Aug 22, 2011 at 19:37

3 Answers 3

Try executing each piece in your console, and see where your exception is:

document.sForm
document.sForm.ePosition
document.sForm.ePosition.options
document.sForm.ePosition.options.length

I tried setting the length of options to 0, and was pretty surprised that it worked (in Chrome). Array.length should be a read-only property, in my opinion. I would use DOM code to remove the elements, something like this:

while (element.hasChildNodes()) {
    element.removeChild(element.firstChild);
}

I was just struck by the same issue and found a convenient solution for those of us using jQuery:

$(selectObject).empty();

I've tested this in IE 7-9, FF 10.0 and Chrome 18 using jQuery 1.4.4.

Question was in pure javascript, please supply first a pure javascript reply. The users could not be interested in jquery since many embedded solutions can't use jquery.