How to show dependent drop down list in forms?

[ashok893]

I'm using two drop down list ina form. I have generated the first drop down list from MySQL database. When i select an option from first drop down list, i have to generate second drop down list options by the selected value of first drop down list from MySQL database.

For example, the first drop down list contains Animals, Birds... If i select the Animal option, the second drop down list should show like Lion, Tiger....

Both lists should be geneted from database only. Any script available for this?
What I have to do? Any one can help me?!

[raji20]

YOU ARE URGED TO USE THE code OR php TAGS WHEN POSTING CODE!!!!
[php]
<?php
mysql_connect("hostname","username","password");
mysql_select_db("databasename");
$firstQry = mysql_query("select * from table1") or die(mysql_error()); // table 1

//////After getting the id from the table1 supply that posted id to get the resuls from the table2 //////////////
$secondQry = mysql_query("select * from table2 where edu_id = '".$_POST["first"]."'") or die(mysql_error()); // table 2
?>
<form name="check" method="post">
<!-- First DropDown starts here -->
<select name="first" onchange="this.form.submit()">
<?php while($res = mysql_fetch_array($firstQry)){?>
<option value="<?php echo $res["id"]?>"><?php echo $res["fullname"]?></option>
<?php }unset($firstQry,$res);?>
</select>
<!-- First DropDown ends here -->
<!-- Second DropDown starts here -->
<?php if(isset($_POST["first"])){?>
<select name="second">
<?php while($row = mysql_fetch_array($secondQry)){?>
<option value="<?php echo $row["edu_id "]?>"><?php echo $row["edu_qualification"]?></option>
<?php }
}unset($secondQry,$row);?>
</select>
<!-- Second DropDown ends here -->
</form>
[/php]
YOU ARE URGED TO USE THE code OR php TAGS WHEN POSTING CODE!!!!

[coool]

I've used your code

I'm having some problems with submiting in the first query.. I mean when I submit in the first query and i ask later for value it gives the next submited value in first query and the previous chosen value of second query

how can I use the same code but without submiting inside my first query ?

maybe I need to use Java Script ??

[erp23]

the best way to do this is to use AJAX - there is a similar post in the forums relating to this. I have used this successfully for a number of drop down boxes for exactly the same situation.

you need an html page, a js page and the php page.

in your html drop box one you will need an onchange function linking it to the javascript file.
in the javascript, you should include the xmlhttp request to the php page that queries the database for the drop down list filtered, for example, a URL variable generated from the javascript. The php should have an echo function, and this can be used to populate your second drop box using getelementbyid.innerhtml in the javascript page

the tutorial at w3schools.com for AJAX should get you going on the javascript syntax you will need, especially the one relating to AJAX and database interactions...

[safnate]

the best way to do this is to use AJAX - there is a similar post in the forums relating to this. I have used this successfully for a number of drop down boxes for exactly the same situation.

you need an html page, a js page and the php page.

in your html drop box one you will need an onchange function linking it to the javascript file.
in the javascript, you should include the xmlhttp request to the php page that queries the database for the drop down list filtered, for example, a URL variable generated from the javascript. The php should have an echo function, and this can be used to populate your second drop box using getelementbyid.innerhtml in the javascript page

the tutorial at w3schools.com for AJAX should get you going on the javascript syntax you will need, especially the one relating to AJAX and database interactions...

Try this site....
http://roshanbh.com.np/2008/01/popul...x-and-php.html

[Alan Murrell]

I am using this code and am able to get it to work with my database for the first two option. I have soccer data, and the first dropdown I select the league, then based on that, the second dropdown populates with teams based on what league they are in; this is to select the home team. I am trying to add a 3rd dropdown which also populates with teams based on the league, which would be the away team.

I have two issues:

1.) The 3rd dropdown shows up after I select from the 2nd dropdown, but is not populated
2.) When I do the last "submit", I want to have it spit out some information based on the teams selected. I have the original script running perfectly, but of course the dropdowns are not populated dynamically; they list *all* the teams, and I press the "Submit" button only once. How would I tell the script after I choose from the 3rd dropdown to actually submit the data and spit out my results?

Here is my code as-is (just the three dropdowns; nothing extra yet):

 
?php
require_once("../_includes/db_con.inc.php");
$database="soccerData";
$firstQry = mysql_query("SELECT DISTINCT League FROM $database ORDER BY League") or die(mysql_error());
$secondQry = mysql_query("SELECT DISTINCT HomeTeam FROM $database WHERE League = '".$_POST["first"]."'") or die(mysql_error());
$thirdQry = mysql_query("SELECT DISTINCT AwayTeam FROM $database WHERE League = '".$_POST["first"]."'") or die(mysql_error());
?>
 
<form name="check" method="post">
<!-- First DropDown starts here -->
<select name="first" onchange="this.form.submit()">
<?php
echo "<option value=\"null\">Select League</option>";
while($row1 = mysql_fetch_array($firstQry)) { ?>
<option value="<?php echo $row1['League'] ?>"><?php echo $row1['League'] ?></option>
<?php } unset($firstQry,$row1); ?>
</select>
<!-- First DropDown ends here -->
<!-- Second DropDown starts here -->
<?php if(isset($_POST['first'])) { ?>
<select name="second" onchange="this.form.submit()">
<?php
echo "<option value=\"null\">Select Home Team</option>";
while($row2 = mysql_fetch_array($secondQry)) { ?>
<option value="<?php echo $row2['HomeTeam'] ?>"><?php echo $row2['HomeTeam'] ?></option>
<?php }
} unset($secondQry,$row2); ?>
</select>
<!-- Second DropDown ends here -->
 
!-- Third DropDown starts here -->
<?php if(isset($_POST['second'])) { ?>
<select name="third">
<?php
echo "<option value=\"null\">Select Away Team</option>";
while($row3 = mysql_fetch_array($thirdQry)) { ?>
<option value="<?php echo $row3['AwayTeam'] ?>"><?php echo $row3['AwayTeam'] ?></option>
<?php }
} unset($thirdQry,$row3); ?>
</select>
<!-- Third DropDown ends here -->
<input type="submit" value="submit" name="submit">
</form>