Cascading select boxes.

[Greg]

We have had this script on our site for a while, and it has always
worked in any browser we have tested. It dynamically fills one select
based on the selection of another select. Unfortunatly, with the
release of NS 7, and the related Mozilla engine, this script no longer
works.

function popPresList(lstParent,lstChild){
clearPresList(lstChild);
var n = lstParent.options[lstParent.selectedIndex].value; // get the
index of the controlling select.
var k = 0;
lstChild.options[++k] = new Option('Not Selected', '0'); // add the
default selection to the child list.
if ( n > 0 )
{
for(i=0;i<aPresHolder.length;i++) // look through the array to
find the proper child array.
{
var presArray = aPresHolder;
if(presArray['parent']==n) // does its parent match ours?
{
txtItem = presArray['name']; // get the text
optValue = presArray['id']; /get the value
lstChild.options[++k]=new Option(txtItem, optValue); //
create a new option
}
}
}
if(k == 0)
{
lstChild.options[++k] = new Option('None Available', '0'); //if
we have no children, display to user.
}
lstChild.selectedIndex=1; // set the seletected index.
}

function clearPresList(lstChild)
{
var longi = lstChild.length;
for ( var i=0; i<=longi -1; i++ )
{
lstChild.options = null; // clear the present options
}
}

The html (stripped of surrounding tables, etc,)


<select name='PRESENTATION_SELECT'
onChange='javascriptopPresList(this,PRESENTATION_SELECT_CHILD);'>
<option value='0'>Not Selected</option>
<option value=301 >Poster</option>
<option value=302 >Oral</option>
</select>
<select name='PRESENTATION_SELECT_CHILD'>
<option value='0'>Not Selected</option>
<option value=1381 >Research</option>
</select>

can anyone shed some light on why this has stopped working, and what I
must to to fix it?

 

[Lasse Reichstein Nielsen]

We have had this script on our site for a while, and it has always
worked in any browser we have tested. It dynamically fills one select
based on the selection of another select. Unfortunatly, with the
release of NS 7, and the related Mozilla engine, this script no longer
works.

That would be little more than a year ago, if you take the Mozilla 1.0
release as a guide. Ofcourse, Netscape 6 was based on a pre-1.0 version,
and people have been using Mozilla for several years.

can anyone shed some light on why this has stopped working, and what I
must to to fix it?

In a Mozilla based browser, if you enter "javascript:" in the address
line or start the javascript console from the menu, what error message
does it show?

/L

 

[Lasse Reichstein Nielsen]

We have had this script on our site for a while, and it has always
worked in any browser we have tested. It dynamically fills one select
based on the selection of another select. Unfortunatly, with the
release of NS 7, and the related Mozilla engine, this script no longer
works.

I am testing in Mozilla Firebird, one of the more recent versions.

Comments:

for(i=0;i<aPresHolder.length;i++) // look through the array to

The "aPresHolder" variable declaration isn't included here, so this
part is hard to test.

....

optValue = presArray['id']; /get the value

This comment needs another "/". I get an "unterminated regular
expression literal" error.


Is there a form around these select elements?

<select name='PRESENTATION_SELECT'
onChange='javascriptopPresList(this,PRESENTATION_SELECT_CHILD);'>

Here "PRESENTATION_SELECT_CHILD" is not defined as a global variable.
Try changing it to
this.form.elements["PRESENTATION_SELECT_CHILD"]
if there is a surrounding form. Otherwise try
document.getElementsById("PRESENTATION_SELECT_CHILD")
and add the id attribute to the second select too.

The "javascript:" is unnecessary.

/L