使用jQuery和PHP问题的动态依赖选择框

时间:2016-02-23 17:01:36

标签: javascript php jquery ajax

这是一个大学项目。 我试图创建四个选择框,分别是国家,州,城市和课程,其中三个依赖于另一个选择。然后,所选的选项将影响将执行的查询,然后填充选择框。它适用于第一个选择框,但我的第三个选择状态时,城市似乎根本不起作用。

HTML

<select name="country" id="countryID" onchange="selectDynamics()" class="searchbox-select>
<option value="">Country</option>
<?php
while($row = $result->fetch_assoc()){
$count=$row['country];
echo '<option value="'.$count.'">'.$count.'</option>;
?>
</select>
<select name ="state" id="stateID" onchange="selectDynamics()"class="searchbox-select">
<option value="">State</option>
</select>
<select name="city" id="cityID" class="searchbox-select">
<option value="">City</option>
</select>
<select name="course" id="courseID" class="searchbox-select">
<option value="">Course</option>
</select>

的jQuery

$(document).ready(function () {
$("#countryID").change(function () {
    var country = $(this).val();
    var dataString = 'country=' + country;
    $.ajax
                ({
                    type: "POST",
                    url: "getStates.php",
                    data: dataString,
                    cache: false,
                    success: function (html) {
                        $("#stateID").html(html);
                    }
                })
})

$("#stateID").change(function () {
    var state = $(this).val();
    var dataString = 'state=' + state;
    $.ajax
    ({
        type: "POST",
        url: "getCities.php",
        data: dataString,
        cache: false,
        sucess: function (html)
        {
            $("#cityID").html(html);
        }
    })
})
})

getCities.php

<?php
include "dbOpen.php";

if($_POST['state'])
{
    $state=$_POST['state'];
    $result2 = $conn->query("select distinct city from ADDR where province='$state' order by city");
    echo '<option value="">City</option>';
    while($row = $result2->fetch_assoc())
    {
        $city=$row['city'];
        echo '<option value="'.$city.'">'.$city.'</option>';
    }
}
?>

getStates.php

<?php
include "dbOpen.php";

if($_POST['country'])
{
    $country=$_POST['country'];
    $result2 = $conn->query("select distinct province from ADDR where country='$country' order by province");
    echo '<option value="">Country</option>';
    while($row = $result2->fetch_assoc())
    {
        $state=$row['province'];
        echo '<option value="'.$state.'">'.$state.'</option>';
    }
}
?>

我无法弄清楚为什么它不起作用,任何帮助都会受到赞赏。另外我知道我的sql代码没有很好地防止SQL注入,但是现在我只想

1 个答案:

答案 0 :(得分:1)

这是因为您在本部分中以功能成功的名义遗漏了一个字母:

$("#stateID").change(function () {
    var state = $(this).val();
    var dataString = 'state=' + state;
    $.ajax
    ({
        type: "POST",
        url: "getCities.php",
        data: dataString,
        cache: false,
        success: function (html)
        {
            $("#cityID").html(html);
        }
    })
})

这就是为什么这个功能永远不会起作用的原因。