[thelist] [DOM] Dynamically adding an OPTION to SELECT - funky IE vs Gecko...

[Tom Dell'Aringa]

Hi there,

Working on a little script to dynamically add a SELECT. The catch is
that the Gecko engine wants to add an OPTION differently than IE. The
rub is in an OPTIONAL parameter in the add() method[1].

Even though it is supposed to be optional, Gecko will not render the
SELECT *unless* I include the index position of the added option. In
addition, it doesn't like the variable i in the for loop at all, it
still errors out. However the error told me enough to supply null,
which works. 

However, this breaks it in IE! Supplying null makes it not render in
IE. BUT supplying the variable i WILL allow it to render! Fab-u-lous!

So there are 3 cases:

newSelect.add(option); // Works in IE, but not Gecko
newSelect.add(option, null);  // Works in Gecko, but not IE
newSelect.add(option, i); // Works in IE< but not Gecko

The question is, how to get it to work in both? Any suggestions?

Here is the function. Note the supplied parameter is a
two-dimensional array for the TEXT and VALUEs of the OPTION.

function BuildSelect(arrayOptions)
{
	var arrayLength = arrayOptions[0].length;
	var oForm = document.forms['baseballForm'];
	var newSelect = document.createElement("SELECT");
	newSelect.className = "ourSelect";
	
	for(var i=0; i<arrayLength; i++)
	{
		option = document.createElement("OPTION");
		option.value = arrayOptions[0][i];
		option.text = arrayOptions[1][i];
		newSelect.add(option, i);
	}
	oForm.appendChild(newSelect);
}

Thanks!

Tom

[1]  <http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/add.asp>

=====
http://www.Pixelmech.com/ - read my latest blog posting!
http://www.DMXzone.com/ - JavaScript Author
http://SparklesParties.com - Princess parties for little girls!
http://www.thywordistruth.net/ - Eternal Life

"Well, my name's Dewey Oxburger. My friends call me Ox. I dont know if you've noticed, but I got a slight weight problem."