Forum Moderators: open
I have a drop-down box which has a number of selections. Two of the selections are "Food services" and "Hospitality".
If either one of these 2 selections is picked - say for example - "Food services" then I would like a second selection box to appear with additional options for "Food services" - without leaving the current html page. But if another selection is picked say "Anything Else" then the second selection box should disappear.
Can this be done in javascript? Do you have any code for this that i could use?
Many thanks for all your help
Hope this helps.
<html>
<head></head>
<body>
<form name="f1">
Enter Food Services <select name="foodselect" onchange="populatesecondMenu()">
<option value="foodservices">Food Services
<option value="entertainment">Entertainment
<option value="hospitality">Hospitality
</select>
<select name="food_additional_select" style="display:none">
</select>
</form>
</body>
</html>
<script>
function populatesecondMenu() {
var selop1value=document.forms[0].foodselect.options[document.forms[0].foodselect.selectedIndex].value;
if(selop1value=="foodservices") {
//alert("came here second menu");
var p1=new Option("Vijayawada","Vijayawada");
var p2=new Option("Governorpet","Governorpet");
var p3=new Option("Chiranjeevi","Chiranjeevi");
document.forms[0].food_additional_select.options[0]=p1;
document.forms[0].food_additional_select.options[1]=p2;
document.forms[0].food_additional_select.options[2]=p3;
document.getElementById("food_additional_select").style.display="block";
}
}
</script>
Thanks
Prasanth
