Change list values of list menu when value of other list meneu is change

**behzad** · Oct 15th, 2003, 11:13 AM

How to change list values of list menu when value of other list meneu is change?

for example i have a list menu(num1) contaning (2 & 3 & 4) values selected itam is 2.and i have another list menu(num2)contaning (400.500,600) values when list menue(num1)is selected 2 valeu.
I wish if list menu(num1) values selected change to 3 then in list menu(num2) change list values to (700.800.900.1000).

very thanks.
sorry for bad english!!

**Acidic** · Oct 27th, 2003, 10:08 AM

I have to say that I never thought this would be so difficult. Well, here you go:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Changing contents of Drop down :: Acid</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
/* If you have any JavaScript questions please e-mail them to me at:
[email protected]
*/

//The arrays are in this format:
//list[i] = [option1,value1,option2,value2,....,option n, value n]

//The list shown if they choose option 2
list2 = new Array()
list2[0] = ["400","1"];
list2[1] = ["500","2"];
list2[2] = ["600","3"];

//This list shown if they choose option 3
list3 = new Array()
list3[0] = ["700","1"];
list3[1] = ["800","2"];
list3[2] = ["900","3"];
list3[3] = ["1000","4"];

//This is shown if they choose option 4
list4 = new Array()
list4[0] = ["0","1"];


function change_other_menu(option) {
document.getElementById('spot').innerHTML = "<select name='select2' onChange='do_something(this.value)'>"
document.getElementById('select2').innerHTML += "<option value='" + eval("list"+option)[0][1] + "'>" + eval("list"+option)[0][0] + "</option>";
for (i=0; i<eval("list"+option).length; i++)
	{
	document.getElementById('select2').innerHTML += "<option value='" + eval("list"+option)[i][1] + "'>" + eval("list"+option)[i][0] + "</option>";
	}
document.getElementById('spot').innerHTML += "</select>"
}

function do_something(choice) {
//This function is only here to show you how to use the 2nd drop down menu
alert("It's value is: " + choice)
}
</script>
</head>

<body>
<select name="select" onChange="change_other_menu(this.value)">
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select>
<br>
The 2nd select:<br>
<span id="spot"></span>
</body>
</html>

E-mail me at [email protected] if you need more help.

Thread: Change list values of list menu when value of other list meneu is change

Thread Tools

Display

Change list values of list menu when value of other list meneu is change

Posting Permissions