我正试图将动态下拉框作为一种搜索工具,以帮助缩小mysql服务器的显示数据范围。我是一个不错的php程序员,但需要javascript和ajax方面的帮助。
该网站目前由3个页面组成:index_test.php、dropdown.php和dropdown.php.
在index_test.php上,有4个下拉菜单需要填充信息。第一个是在页面加载时使用php从mysql表中填充状态名。第二个框使用.change()填充,该框引用php代码,并显示mysql表中处于选定状态的学校。然后,第三个框应该取第二个框中的选定值,并向用户显示选定学校的类名,这一步就是代码中断的地方。php在通过提交表单进行测试时可以工作,但我希望能够在不刷新页面的情况下填充最后两个框。mysql表的格式为:表学校:(学校id,学校,州)表类:(class_id,school_id,class_abrv,class_number)
感谢您的帮助
index_test.php的代码:
<?php include_once("connect.php"); ?>
<html>
<head>
<title>ajax</title>
<script src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#state").change(function(){
var state = $("#state").val();
$.ajax({
type:"post",
url:"dropdown.php",
data:"state="+state,
success: function(data) {
$("#school").html(data);
}
});
});
$("#school").change(function(){
var state = $("#school").val();
$.ajax({
type:"post",
url:"dropdown2.php",
data:"school="+school,
success: function(data) {
$("#classname").html(data);
}
});
});
});
</script>
</head>
<body>
<h1>Get Notes:</h1>
<br/>
<form action="dropdown2.php" method="post">
State: <select id="state" name="state">
<option>--Select State--</option>
<?php
$sql = "SELECT states FROM states";
$result = mysql_query($sql);
while ($output = mysql_fetch_array($result)) {
$state_name = $output['states'];
echo "<option value='"$state_name'">$state_name</option>";
}
?>
</select>
<br/>
School: <select id="school" name="school">
<option>--Select School--</option>
</select>
<br/>
Class Name: <select id="classname" name="classname">
<option>--Select Class Name--</option>
</select>
<br/>
Class Number: <select id="classnumber" name="classnumber">
<option>Select Class Name</option>
</select>
<br/>
<input type="submit" value="Search" />
</form>
</body>
</html>
Dropdown.hp:
<?php
include_once("connect.php");
$state=$_POST["state"];
$result = mysql_query("select schools FROM schools where states='$state' ");
while($school = mysql_fetch_array($result)){
echo"<option value=".$school['schools'].">".$school['schools']."</option>";
}
?>
Dropdown2.php
<?php
include_once("connect.php");
$school=$_POST['school'];
$result = mysql_query("SELECT school_id FROM schools WHERE schools='$school' ");
$school_id = mysql_fetch_array($result);
$id = $school_id['school_id'];
$classname = mysql_query("SELECT DISTINCT class_abrv FROM classes WHERE school_id='$id' ORDER BY class_abrv asc");
while($class = mysql_fetch_array($classname)){
echo"<option value=".$class['class_abrv'].">".$class['class_abrv']."</option>";
}
?>
在第二个ajax函数中,您已经将school下拉框值分配给了state变量,但您将变量school传递给了ajax post。所以,并没有学校变量是你出错的原因。
$("#school").change(function(){
var *state* = $("#school").val();
//above variable should be school.
$.ajax({
type:"post",
url:"dropdown2.php",
data:"school="+*school*,
success: function(data) {
$("#classname").html(data);
}
});
});