问题
i am creating three drop down menu and it work very good but i want that the second drop list appear on the selection of the first one and the third on the selection of the second one how to do that if any one can guide me or give me an example i will appreciate that
PS: the second drop list or table have a foreign key from the first one so here i want to work to populate the second based on the selection of the first.
fun.inc.php
<?php
require_once('db.inc.php');
function connect(){
mysql_connect(DB_Host, DB_User ,DB_Pass )or die("could not connect to the database" .mysql_error());
mysql_select_db(DB_Name)or die("could not select database");
}
function close(){
mysql_close();
}
function countryQuery(){
$countryData = mysql_query("SELECT * FROM country");
while($record = mysql_fetch_array($countryData)){
echo'<option value="' . $record['country_name'] . '">' . $record['country_name'] . '</option>';
}
}
function specializationQuery(){
$specData = mysql_query("SELECT * FROM specialization");
while($recordJob = mysql_fetch_array($specData)){
echo'<option value="' . $recordJob['specialization_name'] . '">' . $recordJob['specialization_name'] . '</option>';
}
}
function governorateQuery(){
$goverData = mysql_query("SELECT * FROM governorate");
while($recordGover = mysql_fetch_array($goverData)){
echo'<option value="' . $recordGover['governorate_name'] . '">' . $recordGover['governorate_name'] . '</option>';
}
}
?>
index.php
<?php
require_once('func.inc.php');
connect();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>testDroplistdown</title>
</head>
<body>
<p align="center">
<select name="dropdown">
<?php countryQuery(); ?>
</select>
</p>
<br />
<br />
<p align="center">
<select name="dropdown2">
<?php governorateQuery(); ?>
</select>
</p>
<p align="left">
<select name="dropdown3">
<?php specializationQuery(); ?>
</select>
<?php close(); ?>
</p>
</body>
</html>
回答1:
make sure u never leave a after your php closing tag and the begging of your html header, it can trow some nasty errors
this script should work
<?php
require_once('func.inc.php');
connect();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>testDroplistdown</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p align="center">
<div id="dropdown1div"><select id="dropdown1" name="dropdown">
<?php countryQuery(); ?>
</select></div>
</p>
<br />
<br />
<p align="center">
<div id="dropdown2div"></div>
</p>
<p align="left">
<div id="dropdown3div"></div>
<script type="text/javascript">
$("#dropdown").change(function() {
val = $(this).val();
var html = $.ajax({
url: "dropdown_select.php?dropdown=2&val="+val+"",
async: true,
success: function(data) {
$('#dropdown2div').html(data);
}////////////function html////////
})/////////function ajax//////////
});
</script>
<?php close(); ?>
</p>
</body>
</html>
dropdown_select.php
<?php
require_once('func.inc.php');
connect();
if(isset($_GET['val'])){
$val = $_GET['val'];
$dropdown = $_GET['dropdown'];
}
if($dropdown == '2'){
echo '<select id="dropdown2" name="dropdown2">';
governorateQuery();
echo '</select>';
?>
<script type="text/javascript">
$("#dropdown2").change(function() {
val = $(this).val();
var html = $.ajax({
url: "dropdown_select.php?dropdown=3&val="+val+"",
async: true,
success: function(data) {
$('#dropdown3div').html(data);
}////////////function html////////
})/////////function ajax//////////
});
</script>
} // end if statement
if($dropdown == '3'){
echo '<select id="dropdown3" name="dropdown3">';
specializationQuery();
echo '</select>';
} // end if statement
close();
?>
回答2:
You can't do that with PHP only, you need to use AJAX.
Ajax is a technique using javascript and PHP to load new results according to user input. Let's say you select a country and you get a new select box with all the cities FROM that country.
You'll have to create an event handler to the first select box:
<select name="dropdown" onchange="loadNewSelectBox(this.value)">
// values
</select>
The loadNewSelectBox would be an function that would post a new xmlhttp request to a php file on your server with the value of your select box. Then you would echo data from that PHP file (json, xml, html..) with response. Your response (for beginner) would probably be html containing the new select box. Then you would append that response to a div or paragraph.
This is an example similar to your task : http://www.w3schools.com/php/php_ajax_database.asp
And this is a good learning source. https://developer.mozilla.org/en-US/docs/AJAX/Getting_Started
来源:https://stackoverflow.com/questions/15129695/php-populate-drop-down-menu-on-the-selection-of-another