hide some options of dropdown menu

reasr · 03-23-2005, 01:50 PM

Hi,

i have a form with some checkbox and dropdown list

if T-shirt option is checked i want to hide the ball options from the dropdown list, and if Ball option is checked i want to hide the T-shirt options

how to do that

Regards,

<html>

<head>

<title>test</title>
</head>

<body>

<form name=calc >
<input type="checkbox" name="tshirt" value="ON">T-shirt
<select size="1" name="description">
<option>Nike</option>
<option>Addidas</option>
<option>Fila</option>
<option>Basket Ball</option>
<option>Football</option>
<option>Tennis Ball</option>
</select></p>
<input type="checkbox" name="ball" value="ON">Ball
</form>

</body>

</html>

eric6930 · 03-23-2005, 03:49 PM

You need to populate the select box dynamically using pre-built arrays. For example,
var aBalls = new Array ("Basket Ball", "Football", "Tennis Ball");
var aTshirts = new Array ("Nike", "Addidas", "Fila");

Initially, you populate your select box with one set of values only.

Then, attach a function on the onClick event to the check-boxes. For example,

function hide(){
if(document.calc.tshirt.checked){
for(var i=0; i<aTshirts.length;i++){
document.calc.description.options[i]=new Option (aTshirts[i]);
}
}
if(document.calc.ball.checked){
for(var i=0; i<aBalls.length;i++){
document.calc.description.options[i]=new Option (aBalls[i]);
}
}

}

You are probably better off using radio buttons instead of check-boxes.

Hope this helps.

reasr · 03-30-2005, 01:32 PM

how about if i want to put values to the dropdown list items???

Regards,

reasr