從屬下拉列表不起作用，第二個下拉列表未加載

Question

我需要與此有關的幫助，我不知道為什么子貓不會加載。 但第一個下拉菜單會加載所有查詢。 我只是不知道為什么它不能與第二個。

這是我的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

<?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>";
}
?>

請檢查我的代碼，並告訴我我在哪里做錯了。 它不會加載第二個下拉菜單。

Answer 1

嘗試做一個簡單的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>

從屬下拉列表不起作用，第二個下拉列表未加載

問題描述

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