Based on the selection of the first drop down list box the options of the second drop down list box can be changed dynamically. This is widely used in forms to narrow down the second html listbox based on the first dropdown list selection.
Examples of two dropdown listboxFor example if you are selecting USA as country from the country list box in html then you can find only States of USA in the second list. It can be from State list to City list also. Based on the selection of the State list we can have city list in the second drop down box.
You can visit the PHP drop down list tutorial to learn how dynamic drop down lists can be developed by server side scripts. You can also see similar server side script in ASP using VBScript where second drop down is managed.
Read how Ajax is used to manage two drop down lists in PHP section.
With this let us go to the demo of the script. Here we have three elements ( options ) in the first drop down list category ( fruits , games and scripts ) and each has three options has three sub options ( sub category ).
Script & DownloadNow let us study how this works and the script for this demo in our next section. You can download the code of this tutorial at the end.
Learn how the same drop down list is developed by taking data from Mysql table
ListBox Validation : Checking if option is selected before submitting a form
ListBox Disable: using disabled property we can disable a listbox by radio button
Adding option: Adding options to a listbox dynamically
Moving Options Moving Options from a listbox to other
Removing Options: Removing options from a listbox
Copying List data : Copying user entered data from one to other form
Dependant list box : Linking two dropdown listboxes
list box with Data : Populating Listbox by taking data from MySQL table
Listbox Menu: Redirecting page based on selection of listbox