Javascript form modification problerms

[wbodger]

So, I am trying use an onchange event to call two different functions, one to change the form action and one to change the options in the next drop down, both dependent on the same selections in the first drop down list. Here is what I have, the action change works, it is the select list that is not working. Any thoughts?

<script type="text/javascript">
<!--//
function changeAction(url) 
{
    if(url=="nofulfillment.asp") {
    document.myform.action = "nofulfillment.asp";
    }
    else if (url=="fulfillment.asp") {
    document.myform.action = "fulfillment.asp";
    }

}
//-->
</script>

<script type="text/javascript">
<!--//
function SelectSubCat(url){
// ON selection of fulfill this function will work

removeAllOptions(document.myform.00N200000019CLw);
addOption(document.myform.00N200000019CLw, "", "--Product--", "");

if(url == 'nofulfillment.asp'){
		addOption(document.myform.00N200000019CLw,"PCmover", "PCmover");
		addOption(document.myform.00N200000019CLw,"Laplink Gold", "Laplink Gold");
		addOption(document.myform.00N200000019CLw,"Laplink Everywhere", "Laplink Everywhere", "");
		addOption(document.myform.00N200000019CLw,"PDAsync", "PDAsync");
		addOption(document.myform.00N200000019CLw,"Conference Center", "Conference Center");
		addOption(document.myform.00N200000019CLw,"RemoteAssist", "RemoteAssist");
}
if(url == 'fulfillment.asp'){
		addOption(document.myform.00N200000019CLw,"PAFGPCMV03000P0EVDEN", "PCmover");
}

}
//-->
</script>

And then within the form itself:

<form name="myform" method="POST" action="fulfillment.asp">

	<table cellpadding="6" cellspacing="0" border="0" align="center" ID="Table1">
	<tr>
		<td align="right" width="200">Fulfillment: </td>
		<td><select id="fulfill" name="fulfill" onchange="changeAction(this.value); SelectSubCat(this.value);">
			<option value="">--Select your fulfillment option--</option>
			<option value="nofulfillment.asp"> Do Not Fulfill Trial
			<option value="fulfillment.asp"> Fulfill Trial
			</select></td></tr>
	<tr>
		<td align="right" width="200">Choose Product:&nbsp;</td>
		<td><select  id="00N200000019CLw" name="00N200000019CLw" title="00N200000019CLw">
			<Option value="">--Product--</Option>
			</select></td></tr>

Thanks!

 

[wbodger]

Sorry, I forgot two functions:

function removeAllOptions(selectbox)
{
	var i;
	for(i=selectbox.options.length-1;i>=0;i--)
	{
		//selectbox.options.remove(i);
		selectbox.remove(i);
	}
}


function addOption(selectbox, value, text )
{
	var optn = document.myform.createElement("OPTION");
	optn.text = text;
	optn.value = value;

	selectbox.options.add(optn);
}

 

[1DMF]

options is the array so you need the index and access is as follows...

selectbox.options[i].function

so to clear a select list use

selectbox.options.length=0;

then add your own options...

selectbox.options[i] = new Option("Text to display in dropdown", "Value to assing if selected", false, false);

you can also make a selection via JS like so...

selectbox..options[i].selected = true;[code]

or check if a selection has been made [code]if(selectbox.options[i].selected == true){do what ever;}

hope fully i've given you enough to talk to the select list element via JS

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!

 

[tsuji]

Also, do not assign name and/or id starting with numeric. Always start with alphabet or underscore would be on the safe-side.