PDA

View Full Version : Generating an optgroup


jonathan
09-04-2002, 07:03 PM
Hi,
I was wondering if there is anyway possible to not only generate a selection list from an array, but also add in there optgroups. I have it set up so that when the page loads a selection menu is populated from several different arrays(this is where I would like to put an optgroup in), but when they click a button it is only populated with the corresponding array. Here's what I got so far.

function menupopulatelist(selected) {
// selected is partly the name of an array
var listobj = findobj("transactions"); //finds the selection object in the page
if (selected){
var selectedArray = eval(selected + "Array");
while (selectedArray.length < listobj.options.length) {
listobj.options[(listobj.options.length - 1)] = null;
}
for (var i=0; i < selectedArray.length; i++) {
eval("listobj.options[i]=" + "new Option(\"" + selectedArray[i] + "\")");
eval("listobj.options[i].value=\"" + selectedArray[i] + "\"");
if (i == selectedArray.length -1){
listobj.options[(i+1)] = new Option(" ");
}
}
}
else{ //called from onload
var optioncounter = 0;
for (var x=0; x<listofArrays.length; x++){
var selectedArray = eval(listofArrays[x] + "Array");
eval("listobj.optgroup = \"" + listofArrays[x] + "\""); // This is where I was guessing
for (var i=0; i < selectedArray.length; i++) {
eval("listobj.options[optioncounter + i]=" + "new Option(\"" + selectedArray[i] + "\")");
eval("listobj.options[optioncounter + i].value=\"" + selectedArray[i] + "\"");

}

optioncounter = optioncounter + i;
if (x == listofArrays.length -1){
listobj.options[(optioncounter + 1)] = new Option(" ");
}
}
}
listobj.focus();
}

Also here is an example of what a hard coded optgroup should look like.

<SELECT NAME=browser>
<OPTGROUP LABEL="Netscape Navigator">
<OPTION LABEL="4.x or higher">
Netscape Navigator 4.x or higher
</OPTION>
<OPTION LABEL="3.x">Netscape Navigator 3.x</OPTION>
<OPTION LABEL="2.x">Netscape Navigator 2.x</OPTION>
<OPTION LABEL="1.x">Netscape Navigator 1.x</OPTION>
</OPTGROUP>
<OPTGROUP LABEL="Microsoft Internet Explorer">
<OPTION LABEL="4.x or higher">
Microsoft Internet Explorer 4.x or higher
</OPTION>
<OPTION LABEL="3.x">Microsoft Internet Explorer 3.x</OPTION>
<OPTION LABEL="2.x">Microsoft Internet Explorer 2.x</OPTION>
<OPTION LABEL="1.x">Microsoft Internet Explorer 1.x</OPTION>
</OPTGROUP>
<OPTGROUP LABEL="Opera">
<OPTION LABEL="3.x or higher">Opera 3.x or higher</OPTION>
<OPTION LABEL="2.x">Opera 2.x</OPTION>
</OPTGROUP>
<OPTION>Other</OPTION>
</SELECT>