Javascript 使用第一个过滤器过滤第二个下拉列表_Javascript_Php_Jquery_Html_Ajax

Javascript 使用第一个过滤器过滤第二个下拉列表

javascript php jquery html ajax

Javascript 使用第一个过滤器过滤第二个下拉列表,javascript,php,jquery,html,ajax,Javascript,Php,Jquery,Html,Ajax,insert.php <html> <head> </head> <?php include 'config.php'; ?> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script> <script type=

insert.php

<html>
<head>

</head>
<?php
        include 'config.php';
    ?>  
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script>
<script type="text/javascript">
        function catFilter(val){

            $.ajax({
                type:"POST",
                url:"filterDropDown.php",
                data: 'cat='+val,
                success: function(data){
                    $("#prd_cat").html(data);
                }
            })
        }
    </script>
    <body>


    <table>
        <form id="product" method="POST" enctype = "multipart/form-data" novalidate>
            <table align="center" width="750" border ="2">
                <tr align="center">
                    <td colspan="7"><h2>Insert Product</h2></td>
                </tr>

                <tr>
                    <td>Type of Product: </td>
                    <td>
                        <select id="prd_type" onChange="catFilter(this.value)">
                            <option value="">Select Type</option>
                            <?php
                                $run = mysqli_query($con, "Select * from typeproduct");
                                while($row = mysqli_fetch_array($run)){
                                    $type_title = $row['type_title'];
                                    $type_id = $row['id'];
                                    echo "<option value='$type_id'>$type_title</option>";
                                }
                            ?>
                        </select>

                    </td>
                </tr>

                <tr>
                    <td>Select Category: </td>
                    <td>
                        <select id="prd_cat">
                            <option value="">Select Category</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>Select Sub Category: </td>
                    <td>
                        <select id="prd_sub_cat">
                            <option value="">Select Sub Category</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>Select Brand: </td>
                    <td>
                        <select id="prd_brand">
                            <option value="">Select Brand</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td><button value="Insert Product" name="insertPrd">Insert Product</button></td>
                </tr>
        </form>
        </form>
        </form>
    </table>
    </body>
</html>


功能滤波器（val）{
$.ajax({
类型：“POST”，
url:“filterDropDown.php”，
数据：“cat=”+val，
成功：功能（数据）{
$（“#prd#U cat”）.html（数据）；
}
})
}
插入产品
产品类型：
选择类型
选择类别

我试图创建一个多级下拉列表来插入产品，并使用不同的类别对其进行过滤。config.php连接到数据库。我想使用type_id筛选类别

但我认为我的ajax代码中存在一些问题，因为它无法重定向到filterDropDown.php，因为我通过filterDropDown.php中的警报语句进行了检查。

请尝试

数据：{cat:val}，

抱歉。。。没用。

<?php
include 'config.php';


    ?>

    <option>Select Category</option>
    <?php
    $get_cat = "Select * from categories where type_id = '"._POST['cat']"'";
    $run_cat = mysqli_query($con, $get_cat);
    while($row = mysqli_fetch_array($run_cat)){

    ?>
        <option value="<?php echo $row['cat_id'];?>"><?php echo $row['cat_name'];?></option>
    <?php   
    }
    ?>

    <?php

?>