Question

我正在尝试创建两个相互依赖的下拉菜单。有两个表类别和子类别，其结构如下所示

类别表

id  catname
1    A
2    B

子类别表

id subcatname  catid
1    S          1
2    T          1
3    U          2

在第一个下拉列表中我有类别列表，在第二个下拉菜单中我有子类别列表。我希望根据类别下拉菜单中选择的类别显示子类别列表。

index.php页面上的代码是

<script>
$(document).ready(function(){
    $('#cat').change(function(){

        var catid = $('#cat').val();
        if(catid != 0)
        {
        alert(catid);
            $.ajax({
                type:'post',
                url:'a_fetchsubcat.php',
                data:{id:catid},
                cache:false,
                success: function(returndata){
                    $('#subcat').html(returndata);
                }
            });
        }
    })
})
</script>


<div class="form-group">
    <label class="control-label col-md-3">Category</label>
    <div class="col-md-9">
        <select class="form-control" name="catid" id="cat">
            <option value="">Select a value</option>
            <?
            $sql="SELECT * FROM category";
            $result=mysqli_query($con,$sql);
            if(mysqli_num_rows($result)>0)
                {
                    while($row=mysqli_fetch_assoc($result))
                        {?>
                            <option value="<? echo $row['id'];?>"><? echo $row['catname']; ?></option>
                      <?}
                }?>
        </select>

    </div>
</div>

<div class="form-group">
    <label class="control-label col-md-3">Subcategory</label>
    <div class="col-md-9">
        <select class="form-control" name="subcatid" id="subcat">
            <option></option>
        </select>
    </div>
</div>

a_fetchsubcat.php上的代码是

<?php
require 'connection.php';
$catid =  $_REQUEST['id']; 

    $sql = "SELECT * FROM subcategory where catid='".$catid."'";
    $result = mysqli_query($con, $sql);
    if (mysqli_num_rows($result) > 0) 
        {
            while($row = mysqli_fetch_assoc($result)) 
                {
                    $subcatname=$row["subcatname"];
                    $subcatid=$row["id"];
?>
<option value="<? echo $subcatid;?>"><? echo $subcatname;?></option>
                  <?}
            }
        else
            {?>
                <option value="">No sub category </option>
            <?}?>

我的问题是，从第一个下拉列表中选择类别后，我无法显示子类别。

Answer 1

你能看到成功的ajax调用 a_fetchsubcat.php 吗？如果是，则尝试更改此行并检查查询中是否有任何错误。

$result = mysqli_query($con, $sql) or die(mysqli_error($con));

Answer 2

您的代码似乎没问题，请确保将您的jquery链接放在脚本代码

之前

创建相互依赖的下拉列表

2 个答案: