创建相互依赖的下拉列表

Posted 2023-02-24

【中文标题】创建相互依赖的下拉列表

【英文标题】：Create interdependent dropdown list

【发布时间】：2015-08-09 11:23:56

【问题描述】：

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

分类表

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>
            <??>

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

【问题讨论】：

您是否检查了 console.for 错误和网络选项卡的请求？

@b0s3 是的，我已经检查过了，我没有得到 catid 的值我也尝试使用 alert() 来检查值，但没有得到任何结果

没有提醒id？

把alert放到if外面看看。

@b0s3 我这样做了，但没有结果

【参考方案1】：

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

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

【讨论】：

我认为我的 catid 没有在 ajax 调用中被携带

【参考方案2】：

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