Full version: jsB@nk » Form » Dropdown » Connected Dropdown Box
URL: https://www.javascriptbank.com/connected-dropdown-box.html
The first dropdown box selects the category; the second is a sub-category of the first. Compact and easy to use.
Full version: jsB@nk » Form » Dropdown » Connected Dropdown Box
URL: https://www.javascriptbank.com/connected-dropdown-box.html
<script language="javascript">// Created by: Christian Heilmann :: http://www.icant.co.uk/function populate(o) { d=document.getElementById('de'); if(!d){return;} var mitems=new Array(); mitems['Choose']=['']; mitems['Salads']=['Select Item','Tuna Salad','Cesar Salad','Green Salad','Prawn Salad']; mitems['Main Courses']=['Select Item','Filet Mignon','Porterhouse','Flank','T-Bone']; mitems['Drinks']=['Select Item','Milkshake','Soda','Mixed Drink','Juice']; mitems['Desserts']=['Select Item','Ice Cream','Fresh Fruit','Pie']; mitems['Snacks']=['Select Item','Brownies','Cookies','Potato Chips']; d.options.length=0; cur=mitems[o.options[o.selectedIndex].value]; if(!cur){return;} d.options.length=cur.length; for(var i=0;i<cur.length;i++) { d.options[i].text=cur[i]; d.options[i].value=cur[i]; }}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<form action="" method="get"><label for="or">Our menu:</label><select name="or" id="or" onchange="populate(this)"> <option value="Choose">Select from the Menu</option> <option value="Salads">Salads</option> <option value="Main Courses">Main Courses</option> <option value="Drinks">Drinks</option> <option value="Deserts">Deserts</option> <option value="Snacks">Snacks</option></select><label for="de">Select:</label><select name="de" id="de"></select><input type="submit" value="Show me" /></form><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->