级联下拉菜单的jQuery阿贾克斯PHP [英] cascading dropdown jquery ajax php
问题描述
我有以下的code,以产生一个级联下拉,但由于某些原因,阿贾克斯后不能正常工作。我可以得到它来填充状态列表,当我选择我的状态提醒,告诉我这是正确的数值,但是,当谈到时间张贴到fetch_state.php似乎张贴空。是否有人可以帮助我,为什么它这样做?
下面是低于
在code的index.php
< PHP
使用error_reporting(E_ALL);
ini_set('的display_errors',1);
包括(connection.php);
?>
<!DOCTYPE HTML>
< HTML>
< HEAD>
<链接相对=样式表的href =style.css文件类型=文本/ CSS/>
< /头>
<身体GT;
< DIV ID =容器>
< DIV ID =体与GT;
< DIV ID =下拉菜单>
< DIV ID =中心类=级联>
< PHP
$ SQL =SELECT DISTINCT状态从tbl_zip ORDER BY状态ASC;
$查询= mysqli_query($ CON,$ SQL);
?>
<标签>状态:
<选择名称=状态ID =状态>
<期权价值=>请选择< /选项>
<?PHP而($ RS = mysqli_fetch_array($查询,MYSQLI_ASSOC)){>
<期权价值=< PHP的echo $ RS [状态];>中>< PHP的echo $ RS [状态]; ?>< /选项>
< PHP}&GT?;
< /选择>
< /标签>
< / DIV>
< DIV ID =城级=级联>< / DIV>
< DIV ID =拉链级=级联>< / DIV>
< / DIV>
< / DIV>
< / DIV>
&所述;脚本的src =http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js>&所述; /脚本>
<脚本>
$(文件)。就绪(函数(){
$(#选择状态)。改变(函数(){
VAR状态= $(#选择状态选项:选择)ATTR('值');。
警报(州);
$(#城)HTML()。
$(#拉链)HTML()。
如果(state.length大于0){
警报(state.length);
$阿贾克斯({
键入:POST,
网址:fetch_state.php
数据:状态=+状态,
缓存:假的,
beforeSend:函数(){
$('#城市)HTML('< IMG SRC =loader.gifALT =宽度=24高度=24>');
},
成功:函数(HTML){
$(#城)HTML(HTML)。
}
});
}
});
});
< / SCRIPT>
< /身体GT;
< / HTML>
fetch_state.php
< PHP
包括(connection.php);
后续代码var_dump($ _ POST);
$状态=修剪(函数mysql_escape_string($ _ POST [国家]));
$ SQL =SELECT DISTINCT市领tbl_zip WHERE状态=$状态ORDER BY城市。
$数= mysqli_num_rows(mysqli_query($ CON,$ SQL));
如果($计数大于0){
$查询= mysqli_query($ CON,$ SQL);
?>
<标签>城市:
<选择名称=城市ID =drop2>
<期权价值=>请选择< /选项>
<?PHP而($ RS = mysqli_fetch_array($查询,MYSQLI_ASSOC)){>
<期权价值=< PHP的echo $ RS [城市];>中>< PHP的echo $ RS [城市]。 ?>< /选项>
< PHP}&GT?;
< /选择>
< /标签>
< PHP
}
?>
&所述;脚本的src =http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js>&所述; /脚本>
<脚本>
$(文件)。就绪(函数(){
$(#选择drop2)。改变(函数(){
VAR STATE_ID = $(#选择选项drop2:选择)。ATTR('值');
//警报(STATE_ID);
如果(state_id.length大于0){
$阿贾克斯({
键入:POST,
网址:fetch_city.php
数据:城市=+城市,
缓存:假的,
beforeSend:函数(){
$('#城市)HTML('< IMG SRC =loader.gifALT =宽度=24高度=24>');
},
成功:函数(HTML){
$(#城)HTML(HTML)。
}
});
} 其他 {
$(#城)HTML()。
}
});
});
< / SCRIPT>
错误我不断收到
警告:mysqli_num_rows()预计参数1被mysqli_result,布尔
首先,改变你的函数mysql_escape_string
到 mysqli_escape_string
$状态=修剪(mysqli_escape_string($ CON,$ _ POST [国家]));
和再包装你的引号中的状态
$ SQL =SELECT DISTINCT市领tbl_zip WHERE状态='$状态。'ORDER BY城市;
另外,拿<脚本>
阻挡 fetch_state.php
的,只是有它在的index.php
与其他<脚本>
块
I have the following code in order to generate a cascading dropdown but for some reason the ajax post is not working. I can get it to populate the state list and when i choose a state i alert to show me the value which is correct, but when it comes time to post to fetch_state.php it seems to post null. Can someone please help me on why its doing that?
Here is the code below
index.php
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
include("connection.php");
?>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="body">
<div id="dropdowns">
<div id="center" class="cascade">
<?php
$sql = "SELECT DISTINCT state FROM tbl_zip ORDER BY state ASC";
$query = mysqli_query($con, $sql);
?>
<label>State:
<select name="state" id = "state">
<option value="">Please Select</option>
<?php while ($rs = mysqli_fetch_array($query, MYSQLI_ASSOC )) { ?>
<option value="<?php echo $rs["state"]; ?>"><?php echo $rs["state"]; ?></option>
<?php } ?>
</select>
</label>
</div>
<div id="city" class="cascade"></div>
<div id="zip" class="cascade"></div>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("select#state").change(function(){
var state = $("select#state option:selected").attr('value');
alert(state);
$("#city").html( "" );
$("#zip").html( "" );
if (state.length > 0 ) {
alert(state.length);
$.ajax({
type: "POST",
url: "fetch_state.php",
data: "state="+state,
cache: false,
beforeSend: function () {
$('#city').html('<img src="loader.gif" alt="" width="24" height="24">');
},
success: function(html) {
$("#city").html( html );
}
});
}
});
});
</script>
</body>
</html>
fetch_state.php
<?php
include("connection.php");
var_dump($_POST);
$state = trim(mysql_escape_string($_POST["state"]));
$sql = "SELECT DISTINCT city FROM tbl_zip WHERE state = ".$state ." ORDER BY city";
$count = mysqli_num_rows( mysqli_query($con, $sql) );
if ($count > 0 ) {
$query = mysqli_query($con, $sql);
?>
<label>City:
<select name="city" id="drop2">
<option value="">Please Select</option>
<?php while ($rs = mysqli_fetch_array($query, MYSQLI_ASSOC)) { ?>
<option value="<?php echo $rs["city"]; ?>"><?php echo $rs["city"]; ?></option>
<?php } ?>
</select>
</label>
<?php
}
?>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("select#drop2").change(function(){
var state_id = $("select#drop2 option:selected").attr('value');
// alert(state_id);
if (state_id.length > 0 ) {
$.ajax({
type: "POST",
url: "fetch_city.php",
data: "city="+city,
cache: false,
beforeSend: function () {
$('#city').html('<img src="loader.gif" alt="" width="24" height="24">');
},
success: function(html) {
$("#city").html( html );
}
});
} else {
$("#city").html( "" );
}
});
});
</script>
Error i keep receiving
Warning: mysqli_num_rows() expects parameter 1 to be mysqli_result, boolean
first, change your mysql_escape_string
to mysqli_escape_string
$state = trim(mysqli_escape_string($con, $_POST["state"]));
and then wrap your state
in quotes
$sql = "SELECT DISTINCT city FROM tbl_zip WHERE state = '".$state ."' ORDER BY city";
also, take the <script>
block out of fetch_state.php
and just have it in index.php
with the other <script>
block
这篇关于级联下拉菜单的jQuery阿贾克斯PHP的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!