填充第二个<选择>基于第一个<select>下拉选项


Populate second <select> drop down based on the first <select> drop down option

我试图根据第一个选择的下拉选项填充第二个下拉列表。

这是我到目前为止的工作:

form.php -我使用javascript调用getgeneral.php。当用户从(第一个)下拉菜单中选择:

时,将显示第二个下拉菜单。
<html>
<head>
<script type="text/javascript">
function get_states() { // Call to ajax function
    var classitem = $('#classitem').val();
    var dataString = "classitem="+classitem;
    $.ajax({
        type: "POST",
        url: "getgeneral.php",
        data: dataString,
        success: function(html)
        {
            $("#get_general").html(html);
        }
    });
}
</script>
</head>
<body>
<form action="" method="POST">
<?php 
include('conn.php');
$result=mysqli_query($con,"SELECT * FROM classtable");
?>
<select id="classitem" name="classitem" onchange="get_states();">
<option value=''>Select</option>
<?php 
while ($row = mysqli_fetch_array($result)) {
    echo "<option value='" . $row['genclasscode'] . "'>" . $row['description'] . "</option>";}
?>
</select>
<div id="get_general"></div>
</form>
</body>
</html>

这是getgeneral.php,它将根据第一个下拉列表获取数据:

<?php
include('conn.php');
if ($_POST) {
    $classitem = $_POST['classitem'];
    if ($classitem != '') {
       $result1=mysqli_query($con,"SELECT * FROM generalclass WHERE genclasscode='$classitem'");
       echo "<select name='classitem'>";
       echo "<option value=''>Select</option>"; 
       while ($row = mysqli_fetch_array($result1)) {
          echo "<option value='" . $row['specclassid'] . "'>" . $row['description'] . "</option>";}
       echo "</select>";
    }
    else
    {
        echo  '';
    }
}
?>

PROBLEM: 第二个下拉列表不会显示。当我运行form。php

时不会出现错误

很抱歉太晚回答这个问题。

问题是我忘记在我的代码中包含jQuery。

我像这样包含jQuery,在<head> </head>部分之间:

<link rel="stylesheet" type="text/css" href="jquery-ui-1.10.4.custom/css/custom-theme/jquery-ui-1.10.4.custom.min.css">
<script src="jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

感谢BryanChitowns24在上面的评论。