Dynamic dropdown / Double Combo

younus

I am trying to create a double dropdown combo. In the first one, user will select a state out of 50. Then based on the state selected, user will see the cities available in that state in the second dropdown box. City names will come from a database. I was able to do this, but had to use two frames for the dropdown boxes (box 1 in first frame would pass the value to the second frame). Is there a way to do it without using frames? Any help will be appreciated. I am using PHP/MySQL.

Nate

The easiest way would be to simply let them select a state with the first pull down and use javascript to submit that state to your script, then populate your next pull down box with all the cities.

$query=mysql_query("SELECT city FROM table WHERE state='$state'");
while($res=mysql_fetch_array($query)) {

echo "<option>".$res["city"]."</option>";

}

younus

Thanks for your reply.

Can this be done while still on the same page? That is, the second dropdown values (cities) appear dynamically as soon as a state is selected in the first box (without having to leave the page).

Nate

I was afraid you'd ask that. Well if you know a little javascript it shouldn't be too hard. Might find this helpful: http://javascript.internet.com/forms/dropdown-box-population.html

younus

Thanks again for your help.

If I understand right, using the JavaScript you mentioned or others like that, I will have to retrieve ALL the cities in all 50 states from the database before the user selects a state. I am trying to avoid that, and am looking for a solution that would trigger the php form ONLY after a state is selected by the user, thus only fetching the cities for that state from the database. Is it possible? I hope I am explaining the question right.

maxpup979

If it is more important to load only the appropriate cites...you have to submit the form, and reload/load the appropriate page. However, if it is more important to not have to reload/load a page, then you can use Javascript to accomplish it. Its that simple. You just have to figure out which matters more.

Nate

Yeah, to reiterate what maxpup979 said... If you don't want to have to load all cities for all 50 states you can "trigger" the form to post after they select a state (i.e. without a submit button) but it would still have to reload your page.

If you don't mind querying for all cities in all states at the initial page load then javascript would allow the user to select a state and then populate the cities pulldown with the appropriate cities. However that would, as you asked, require you to do 1 query for all cities and have all that information in your javascript.

I don't think that would be too much of a problem as far as page load time.

younus

Thank you Nate and maxpup979.