从属下拉列表不起作用,第二个下拉列表未加载 [英] Dependent dropdowns not working, 2nd dropdown not loading
本文介绍了从属下拉列表不起作用,第二个下拉列表未加载的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要与此有关的帮助,我不知道为什么子猫不会加载.但第一个下拉菜单会加载所有查询.我只是不知道为什么它不能与第二个一起使用.
I need help with this one, i dont know why the sub cat wont load. but the first dropdown loads all the queries. i just dont know why it wont work with the 2nd one.
这是我的index.php
here is my index.php
<?php
include('config.php');
$query_parent = mysql_query("SELECT * FROM zipcodes GROUP BY major_area") or die("Query failed: ".mysql_error());
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Dependent DropDown List</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#parent_cat").change(function() {
$(this).after('<div id="loader"><img src="img/loading.gif" alt="loading subcategory" /></div>');
$.get('loadsubcat.php?parent_cat=' + $(this).val(), function(data) {
$("#sub_cat").html(data);
$('#loader').slideUp(200, function() {
$(this).remove();
});
});
});
});
</script>
</head>
<body>
<form method="get">
<label for="category">Parent Category</label>
<select name="parent_cat" id="parent_cat">
<?php while($row = mysql_fetch_array($query_parent)): ?>
<option value="<?php echo $row['major_area']; ?>"><?php echo $row['major_area']; ?></option>
<?php endwhile; ?>
</select>
<br/><br/>
<label>Sub Category</label>
<select name="sub_cat" id="sub_cat"></select>
</form>
</body>
</html>
这是我的loadsubcat.php
and here is my loadsubcat.php
<?php
include('config.php');
$parent_cat = $_GET['parent_cat'];
$query = mysql_query("SELECT city FROM zipcodes WHERE major_area = {$parent_cat}") or die(mysql_error());
while($row = mysql_fetch_array($query)) {
echo "<option value='$row[city]'>$row[city]</option>";
}
?>
请检查我的代码,并告诉我我在哪里做错了.它不会加载第二个下拉菜单.
please check my codes, and tell me where i did it wrong. it wont load for the 2nd drop down.
推荐答案
尝试执行简单的AJAX
函数:
<script type="text/javascript">
function AjaxCall(ElemVal,PlaceId) {
$.ajax({
url: "loadsubcat.php?parent_cat="+$(ElemVal).val(),
success: function(result) {
$("#"+ PlaceId).html(result);
}
});
}
$(document).ready(function() {
$("#parent_cat").change(function() {
$("#sub-cat-load").html('<div id="loader"><img src="img/loading.gif" alt="loading subcategory" /></div>');
AjaxCall(this,'sub-cat-load');
});
});
</script>
sub_cat容器
<label>Sub Category</label>
<!-- NOTICE THIS PART -->
<div id="sub-cat-load"></div>
loadsubcat.php
<?php
include('config.php');
// You may want to sanitize this variable
$parent_cat = $_GET['parent_cat'];
$query = mysql_query("SELECT city FROM zipcodes WHERE major_area = {$parent_cat}") or die(mysql_error()); ?>
<select name="sub_cat" id="sub_cat"><?php
while($row = mysql_fetch_array($query)) { ?>
<option value="<?php echo $row[city]; ?>"><?php echo $row[city]; ?></option><?php
} ?>
</select>
这篇关于从属下拉列表不起作用,第二个下拉列表未加载的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文