PHP填充下拉列表，onchange根据值填充不同的下拉列表答案

【问题标题】：PHP populated dropdown, onchange populate different dropdown based on valuePHP填充下拉列表，onchange根据值填充不同的下拉列表
【发布时间】：2016-10-10 13:03:58
【问题描述】：

你好，这是我的问题，

我有一个包含类别和子类别的数据库。我有两个下拉框（选择）。我希望它们都使用 PHP/MYSQL 填充。

我的分类已经生成：

<select name="prod_cat">
    <?php
        include("php/dbconnect.php");

        $sql = "SELECT * FROM categories";
        $result = mysqli_query($conn, $sql);

        if (mysqli_num_rows($result) > 0){
            while ($row = mysqli_fetch_array($result))
            {
            echo '<option value="'. $row["cat_name"] .'">'. $row["cat_name"] .'</option>';
            }
        }
        else{echo "No categories were found!";}
        mysqli_close($conn);
    ?>
</select>

我希望在类别更改时加载子类别。我的 SQL 将如下所示：

SELECT subcat_name FROM subcategories WHERE cat_name = '$prod_cat'

我需要从类别下拉列表中获取值并将其存储为变量。过去我在 javascript 中做过类似的事情：

var subcat=document.forms["form"]['subcat'].value;

然后通过调用 onChange() 更改另一个下拉列表的值；函数如下：

document.getElementById('subcat').innerHTML='<option value=""></option>';

我希望有人能指出我正确的方向！我应该研究 AJAX、JavaScript 还是可以全部用 PHP 完成？

谢谢。

【问题讨论】：

你应该将 jquery 与 AJAX 结合使用。你想得到的东西不能单独在 php 中完成，因为 php 是服务器端，而 JavaScript 和下拉选择是客户端。但是，您可以使用 jquery 为下拉菜单执行“onChange”功能，然后通过 AJAX 调用 PHP 脚本来插入内容。希望这会有所帮助。

标签： javascript php ajax forms dropdown

【解决方案1】：

在类别选择框上添加一个 id，像这样 -

<select name="prod_cat" id="prod_cat">
    <?php
        include("php/dbconnect.php");

        $sql = "SELECT * FROM categories";
        $result = mysqli_query($conn, $sql);

        if (mysqli_num_rows($result) > 0){
            while ($row = mysqli_fetch_array($result))
            {
            echo '<option value="'. $row["cat_name"] .'">'. $row["cat_name"] .'</option>';
            }
        }
        else{echo "No categories were found!";}
        mysqli_close($conn);
    ?>
</select>

对于子类别-

<select id='sub_cat' name='sub_cat'></select>

像这样写你的脚本 -

<script>
$("#prod_cat").change(function(){
    //get category value
    var cat_val = $("#prod_cat").val();
    // put your ajax url here to fetch subcategory
    var url             =   'www.example/fetch_subcategory.php';
    // call subcategory ajax here 
    $.ajax({
                   type:"POST",
                   url:url,
                   data:{
                       cat_val : cat_val
                   },

                   success:function(data)
                    {
                        $("#sub_cat").html(data);
                    }
                });
});
</script>

在ajax调用页面添加代码-'www.example/fetch_subcategory.php'

<?php
$prod_cat = $_POST['cat_val'];

$sql = "SELECT subcat_name FROM subcategories WHERE cat_name = '$prod_cat'";
       $result = mysqli_query($conn, $sql);
$msg ='';
        if (mysqli_num_rows($result) > 0){
            while ($row = mysqli_fetch_array($result))
            {
           $msg =.'<option value="'. $row["sub_cat_name"] .'">'. $row["sub_cat_name"] .'</option>';
            }
        }
        else{$msg .="No categories were found!";}
        echo $msg;
        mysqli_close($conn);

        ?>

做这样的事情，希望它对你有用。

【讨论】：

感谢您的帮助。我现在正在尝试您的方法，但还没有奏效，我正在尝试找出原因。我需要链接 AJAX 库吗？