Question

我有一个关于如何从SQL数据库填充两个单独列表的查询，我的数据库看起来像这样;

shoe_id      shoe_type       shoe_color
_________________________________________
001          Hi-Top          Blue
002          Loafer          Black
003          Brogue          Brown
004          Brogue          Black
005          Loafer          Brown
006          Loafer          Red
007          Hi-Top          Yellow

我想知道如何创建一个选择列表来显示shoe_type，第二个根据shoe_type动态改变，以显示shoe_color。

例如，在第一个选择列表中选择“Brogue”，然后在第二个选择列表中显示“Brown”和“Black”。

提前谢谢。

Answer 1

如果预取了数据库，您可以根据数据库生成此结构：

shoes array(3) {
    ['Hi-Top'] => array(2) {
        [1] => 'Blue',
        [7] => 'Yellow'
    }
    ['Loafer'] => array(3) {
        [2] => 'Black',
        [5] => 'Brown',
        [6] => 'Red',
    }
    ['Brogue'] => array(2) {
        [3] => 'Brown',
        [4] => 'Black'
    }
}

并在HTML生成器中：

<select name="type">
    <?php foreach($shoes as $shoeType => $shoeColors): ?>
        <option value="<?= $shoeType ?>" <?php if(isset($_POST['type']) && $_POST['type'] == $shoeType) echo 'selected="selected"'?>><?= $shoeType?></option>
    <?php endforeach; ?>
</select>
<select name="color">
    <?php if (isset($_POST['type']) foreach($shoes[$_POST['type']] as $k => $v): ?>
        <option value="<?= $k ?>" <?php if(isset($_POST['color']) && $_POST['color'] == $k) echo 'selected="selected"'?>><?= $v ?></option>
    <?php endforeach; ?>
</select>

现在，如果您可以在会话中保存$ _POST [＆＃39;类型＆＃39;]和$ _POST [＆＃39; color＆＃39;]以供日后使用，那么您永远不需要JS at即使在浏览器上禁用了JS，所有和您的代码也能正常工作。

但如果你愿意，你可以使用JS。 Json对它进行编码并在你的javascript中使用它。而不是唯一的方法是使用AJAX。

var shoes = <?= json_encode($shoes) ?>

从SQL数据库</select>动态填充两个<select>列表

1 个答案: