Bonge Boo! wrote:
This has got to be obvious, but I can't make it work.
I have a form called with 3 pull down menus. They are linked to a
database which generates the values for the <SELECT? Pull-downs.
Lets say I have values selected for all three pull down menus.
When I change the first "top-level" menu I want to reset both the
second and third menus to the "default" state.
I thought this would be easy with some javascript on the pull down in
question like:
<select name="category"
onchange="document.forms.form_field.options[0];">
So when I change category I reset my sub-categories and
sub-sub-categories back to NULL to avoid duff queries being made.
I've tried any number of iterations, but it still won't work.
Please put me out of my misery?
TIA.
Are these 'cascading selects' (each choice gets more specific)? If so,
the application itself should reset the dependent listboxes as needed.
Just for the record:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript">
function ddreset()
{
if (document.getElementById)
{
var sel, o, j, l = arguments.length;
for (var i = 0; i < l; ++i)
{
if (sel = document.getElementById(arguments[i]))
{
j = 0;
while (o = sel.options[j++])
if (o.defaultSelected)
o.selected = true;
}
}
}
}
</script>
</head>
<body>
<form>
<select id="toplevel" name="toplevel"
onchange="ddreset('second','third')">
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
<option value="4">option 4</option>
<option value="5">option 5</option>
</select>
<select id="second" name="second">
<option value="a">an option</option>
<option value="b">an option</option>
<option value="c">an option</option>
<option value="d">an option</option>
<option value="e" selected="selected">default option</option>
</select>
<select id="third" name="third">
<option value="aa">an option</option>
<option value="bb" selected="selected">default option</option>
<option value="cc">an option</option>
<option value="dd">an option</option>
<option value="ee">an option</option>
</select>
</form>
</body>
</html>
