Three interlinked dropdown list using JQuery

smo1234 09:03:16	Data taken from MySQL table. Front end is managed by Jquery. There are three dropdown list boxes to display country > State > City. On selection of City the form submits data to a new page. Check tutorial on three drop down list box here Your views please.
bond1126 09-06-2016	How to pull data from multiple tables? For example, I have tbl_city1 and tbl_city2 When the Orange county is selected it will show all the cities from tbl_city1 When the Monroe county is selected it will show all the cities from tbl_city2 Thanks.
smo1234 09-07-2016	Here you need not Link tables to get data from both tables, a simple switch condition check will tell which table to use. switch ($country) { case "Orange": $table_name="tbl_city1"; break; case "Monroe": $table_name="tbl_city2"; break; } $query="select cities from $table_name where ...."; You can add more cases to switch condition if you have more tables.
bond1126 09-07-2016	Currently the code looks like this: $q_county="select city_id,city from tbl_city1 where "; if(strlen($county_id) > 0){ $q_county= $q_county . " county_id = :county_id "; } Where do I put the switch statement?
JamWales 07-29-2017	Hi - great tutorial, works a treat :) Is there a way, when the page first loads, to automatically set a 1st dropdown to default value, with the 2nd and 3rd dropdowns being automatically populated accordingly? Once loaded, should the user choose, they can change the values in the dropdowns as per your design. Many thanks.
smo1234 07-30-2017	To make any country selected in first dropdown list add this line just after document.ready() like this `$(document).ready(function() { $("#country_code").val('GBR'); // This will make Great Britain as default selection ..... ..` But that is not enough .. The second list must show states of Great Britain. For this we need to trigger the change function of 2nd dropdown list . This part is also to be executed once one country is set by default. `$(function () { $("#country_code").change(); });` Now here is the full code to be added at top to document.ready() `$(document).ready(function() { $("#country_code").val('GBR'); $(function () { $("#country_code").change(); }); ...... ...... rest of your code goes here. ......`
smo1234 07-30-2017	Pre-selection of country Say some one has clicked a country name and you want to show this three dropdown list. Here visitor need not select the same country again from the first list. You can collect the country code ( or country name ) from the query string and the pass the value to JQuery part to keep the same country as default selected. `three-list.php?country=CAN` Here three-list.php is the page showing three dropdown list to the users. You can collect the list like this ( PHP script here ) `$country=$_GET['country'];` Now you can pass the $country variable data by one hidden field of the form `<input type=hidden id=sel_country name=sel_country value=$country>` Then create the JQury variable like this. `var sel_country=$('#sel_country').val();` Now this varaible sel_country can be used in above code to set the value from default selected country. `$("#country_code").val(sel_country);`
smo1234 07-30-2017	Click the link here : Welcome to India
SowmyaSP 11-21-2017	Hi I am Using Your Three dropdown List script I want retrieve all the column details including country state city. How Can I able to achieve this Please let me know
smo1234 11-21-2017	Select Country then State then city , once you submit the form next page all details are available. Try the demo.