Wondering if anyone can spot what is wrong in this code, and tell me how to fix it.
I’m trying to dynamically populate a select options object on my html page.
What I have is an options select which after choosing will offer different options in 2nd one depending on choice in first, then ultimately, a 3rd based off the second.
I have this:
Calling the function below when the 1st option is made. This works OK.
My function then should change a text label for the 2nd option list, then reset (clear) the second options list, then depending on the selection in first, using the if statements, repopulate the 2nd options list.
But as soon as I uncomment any of the lines I have so far, the function seems to fail completely, nothing happening, including the text label no longer changing.
I started with (to me) the obvious document.form1a…. statement, then tried another way.
Both same results.
I can’t see anything I have done wrong?
Function:
Form statement (could the action be at fault? The form doesn’t actually post anything):
Steve (Delphi 2007 & XP)
I’m trying to dynamically populate a select options object on my html page.
What I have is an options select which after choosing will offer different options in 2nd one depending on choice in first, then ultimately, a 3rd based off the second.
I have this:
Code:
<select name="DWGtype" id="DWGtype" size="1" onChange="SelType()">
My function then should change a text label for the 2nd option list, then reset (clear) the second options list, then depending on the selection in first, using the if statements, repopulate the 2nd options list.
But as soon as I uncomment any of the lines I have so far, the function seems to fail completely, nothing happening, including the text label no longer changing.
I started with (to me) the obvious document.form1a…. statement, then tried another way.
Both same results.
I can’t see anything I have done wrong?
Function:
Code:
<script type="text/javascript">
function SelType()
{
var workdamnyou = document.getElementById("form1"); //works OK with this line in
//document.form1a.2ndSelect.options.length=0; //my original line breaks it if commented out
//workdamnyou.2ndSelect.options.length=0; //2nd try line also breaks it if commented out
if (DWGtype.value==='FrontPanel')
{
document.getElementById("2ndLevel").innerHTML = "Height:"; //this works beautifully AS LONG as two lines above and all below are commented out
// workdamnyou.2ndSelect.options[0]=new Option("select", "select", true, false);
// workdamnyou.2ndSelect.options[1]=new Option("1U", "1U", false, false);
// workdamnyou.2ndSelect.options[2]=new Option("2U", "2U", false, false);
// workdamnyou.2ndSelect.options[3]=new Option("3U", "3U", false, false);
// workdamnyou.2ndSelect.options[4]=new Option("4U", "4U", false, false);
// workdamnyou.2ndSelect.options[5]=new Option("5U", "5U", false, false);
// workdamnyou.2ndSelect.options[6]=new Option("6U", "6U", false, false);
// workdamnyou.2ndSelect.options[7]=new Option("7U", "7U+", false, false);
}
else if (DWGtype.value==='RearPanel')
{
document.getElementById("2ndLevel").innerHTML = "Height2:";
}
else
{
document.getElementById("2ndLevel").innerHTML = "other text:";
}
}
</script>
Form statement (could the action be at fault? The form doesn’t actually post anything):
Code:
<form action="" method="post" name="form1a" id="form1">[/ code]
The 2nd options list and text label:
[code]
<td align= "right"><div id="2ndLevel">Select prev</div></td>
<td colspan= "3">
<select name="2ndSelect" ID ="prjtype" size="1">
<option value="SelectOne" selected="selected"> </option>
<option value="1U">you must select type</option>
</select>
</td>
Steve (Delphi 2007 & XP)