使用mysql数据库根据第一个下拉框自动填充第二个下拉框

Question

我需要一个选择框显示选项，这些选项基于它上方的下拉框的选择。 一旦用户选择了汽车制造商，那么我希望选择汽车制造商的汽车模型。

我已经能够从mysql数据库中获得要显示的汽车制造商选项，但是现在我只需要该制造商的汽车模型。 我的数据库有两个列，一个用于Make，一个用于Model。

PHP的顶部是我获得商标的方式，底部是我尝试获得模型的方法，但是它显示了数百个模型，而不仅仅是我想要的几个。 我听说AJAX或javascript可以自动上传结果，这很好。 任何帮助都很棒。 谢谢！

</div>

<?php
    mysql_connect('localhost', '*****', '******');
    mysql_select_db('*************');
    $sql = "SELECT Make FROM CarMakes";
    $result = mysql_query($sql);
    echo "<select name='carmake3'>";
    while ($row = mysql_fetch_array($result)) {
        echo "<option value='" . $row['Make'] . "'>" . $row['Make'] . "</option>";
    }
    echo "</select>";
?>
<?php
    mysql_connect('localhost', '******', '**********');
    mysql_select_db('*************');
    $sql = "SELECT Model FROM myTable";
    $result = mysql_query($sql);
    echo "<select class='modelbox' name='carmodel3'>";
    while ($row = mysql_fetch_array($result)) {
        echo "<option value='" . $row['Model'] . "'>" . $row['Model'] . "</option>";
    }
    echo "</select>";
?>
<input type="text" maxlength="4" name="car3year" placeholder="year" class="WriteInBox"/>

<input type="text" maxlength="6" name="car3miles" placeholder="miles" class="WriteInBox"/>

</div>

Answer 1

$sql = "SELECT Model FROM myTable";

显然，这可以为您提供所需的结果。 它将选择所有型号。

你的sql应该看起来像

$sql = "SELECT Model FROM myTable WHERE Make='Make'";

在哪里限制您仅检索与您选择的特定品牌相关的模型。

要使用AJAX做到这一点，您正在使用jQuery吗？ 带有Ajax调用的直接JavaScript？ 请提供更多信息以回答问题的这一部分。

Answer 2

这可能不是执行此操作的最佳方法，但是当我之前不得不做类似的事情时，我通常使用php在标头中填充一些JavaScript变量，然后使用javascript创建选择。 另外，我假设您的数据库中有一些东西可以将某些模型映射到某些车辆型号。

<script>
var makes = new Array();
var models = new Array();
<?php
$sql = "SELECT Make FROM CarMakes";
$result = mysql_query($sql);
while ($row = mysql_fetch_assoc($result)) {
?>
    makes[] = <?php echo json_encode($row['Make']); ?>;
<?php
}
$sql = "SELECT Make FROM CarMakes";
$result = mysql_query($sql);
while ($row = mysql_fetch_assoc($result)) {
?>
    models[] = <?php echo json_encode($row['Model']); ?>;
<?php
}
?>
</script>

在这里，您可以创建选择并使用make数组的元素填充第一个选项。 然后将onChange事件添加到第一个选择中以填充第二个选择。

编辑对于选择创建：

<select id="make-select" onChange="updateModels()">
</select>
<select id="model-select">
</select>
<script>
$(function() {
    $.each(makes, function (index, value) {
        $(#make-select).append($('<option>') {
            value: value,
            text: value
        });
    });
}
</script>

然后只需创建一个名为updateModels的函数，该函数将根据make-select的选定值更新model-select make-select 。 同样，你需要服用点与数据库中的品牌关联模型，那么你可能必须做出makes变量的对象，而不是仅仅一个阵列。

var models = new Object()
<?php
    $sql = "SELECT Model-Make, Model FROM CarMakes";
    ...
    models.make = <?php echo json_encode($row['Model-Make']); ?>;
    models.model = <?php echo json_encode($row['Model']); ?>;
    ...
?>