通过PHP和Ajax动态下拉列表

Question

嘿我试图使用PHP和AJAX创建动态下拉列表。值得一提的是我在wordpress网站上使用视觉作曲家。所以我必须把它作为视觉作曲家的短代码。

目前这是我所拥有的。

    function dropdownmenu() { 
include_once "connection.php";
?>
    <div class="make">
    <label>Make</label>
        <select name="makelist" onchange="getId(this.value);">
            <option value="">Select Make</option>

        <?php       
        $query = "select distinct(Make) from websitemasterlist order by Make ASC";
        $results = mysqli_query($conn, $query);

        foreach($results as $info) {
        ?>
            <option value="<?php echo $info[Make]; ?>"><?php echo $info[Make]; ?></option>

        <?php
        }
        ?>
        </select>
    </div>

    <div class="model">
    <label>Model</label>
        <select name="model" id="modellist">
            <option value="">Select Model</option>
        </select>
    </div>

    <script src="code.jquery.com/jquery-3.2.1.min.js"></script>
    <script>
        function getId(val){
            $.ajax({
                type: "POST",
                url: "getdata.php",
                data: "make="+val,
                success: function(data){
                    $("#modellist").html(data);
                }
            });
        }
    </script>
<?php
}
add_shortcode('dropdownform','dropdownmenu');

?>

我认为错误是在ajax的某个地方。因为我的阿贾克斯很弱。

这是辅助动态下拉列表的代码

<?php
include_once "connection.php";

if (!empty($_POST["make"])) {
    $make = $_POST["make"];
    echo $make;
    $query = "SELECT distinct(Model) FROM websitemasterlist where Make=$make";
    $results = mysqli_query($conn, $query);

    foreach ($results as info2){
    ?>
    <option value="<?php echo info2["Model"]; ?>"><?php echo info2["Model"]; ?></option>
    <?php
    }
}
?>

第一个下拉列表有效。但是当我在第一个下拉列表中做出选择时，第二个下拉列表并未显示任何选项。任何帮助将不胜感激，谢谢。它也值得一提，当我试图回应制作....我没有看到制作。所以我很确定ajax部分搞砸了。

  

我从控制台获得的错误