从属下拉列表不起作用，第二个下拉列表未加载

Question

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. 我只是不知道为什么它不能与第二个。

here is my index.php 这是我的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>

and here is my loadsubcat.php 这是我的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. 它不会加载第二个下拉菜单。

Answer 1

Try doing a simple AJAX function: 尝试做一个简单的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 container sub_cat容器

<label>Sub Category</label>
<!-- NOTICE THIS PART -->
<div id="sub-cat-load"></div>

loadsubcat.php 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>

从属下拉列表不起作用，第二个下拉列表未加载

问题描述

1 个解决方案

解决方案1
0 2014-10-31 04:28:39

从属下拉列表不起作用，第二个下拉列表未加载

问题描述

1 个解决方案

解决方案1 0 2014-10-31 04:28:39

解决方案1
0 2014-10-31 04:28:39