Question

我希望在html + php中创建表单。我的数据库中有2个表。

类别： id_category，类别
Dairy： id_dairy，id_category，product_name

现在是个问题。如何创建包含2个select下拉列表的1个表单。是否可以在没有AJAX的情况下在PHP中完成？

我的意思是 - 我想选择类别，然后选择没有刷新页面的产品。

代码：

<form role="form" action="kalorie.php" method="post">
      <div class="form-group">
        <label for="kategoria">Kategoria:</label>
        <select class="form-control" name="kategoria">
          <option>Wybierz kategorie</option>
            <?php
              $sql_1 = "SELECT * FROM produkty";
              $result_1 = mysqli_query($conn, $sql_1);

              while($row_1 = mysqli_fetch_assoc($result_1)) {
                echo '<option>'.$row_1["produkt"].'</option>';
              }

              $kat = $_POST['kategoria'];
            ?>
        </select>
        <select class="form-control" name="produkt">
          <option>Wybierz produkt</option>
            <?php
              $sql_2 = "SELECT * FROM $kat";
              $result_2 = mysqli_query($conn, $sql_2);

              while($row_2 = mysqli_fetch_assoc($result_2)) {
                echo '<option>'.$row_2["produkty"].'</option>';
              }
            ?>
        </select>
      </div>
      <button type="submit" class="btn btn-default" name="oblicz">Wyślij</button>
    </form>

Answer 1

Ajax是最好的解决方案。但是如果你想要一个替代品，你可以使用＆＃34; iframe＆＃34;并在该框架中提交ypur表格。

Answer 2

非Ajax解决方案：

将产品子类别加载到由类别ID键入的JavaScript对象中。在类别选择列表中更改类别后，请交换产品列表中的选项。

<script>
var produkts = {
<?php
$sql_2 = "SELECT * FROM $kat";
$result_2 = mysqli_query($conn, $sql_2);

$id_category = 0;
list($delim1, $delim2) = array('', '');
while($row_2 = mysqli_fetch_assoc($result_2)) {
    $delim2 = '"';
    $row_2 = $row['value'];
    if ( $id_category != $row_2['id_category'] ) {
        $id_category = $row_2['id_category'];
        echo $delim1 . $id_category . ': "';
        $delim1 = '", ';
    }
    echo '<option>' . $row_2['produkty'] . '</option>';
}
echo $delim2;

?>
};
// example: {1: "<option>cheese</option><option>butter</option>", 2: "<option>ice cream</option>"}
</script>

<form role="form" action="kalorie.php" method="post">
  <div class="form-group">
    <label for="kategoria">Kategoria:</label>
    <select class="form-control" name="kategoria">
      <option>Wybierz kategorie</option>
        <option value="1">Me</option>
        <option value="2">You</option>
        <?php
          $sql_1 = "SELECT * FROM produkty";
          $result_1 = mysqli_query($conn, $sql_1);

          while($row_1 = mysqli_fetch_assoc($result_1)) {
            echo '<option>'.$row_1["produkt"].'</option>';
          }

          $kat = $_POST['kategoria'];
        ?>
    </select>
    <select class="form-control" name="produkt">
      <option>Wybierz produkt</option>
    </select>
  </div>
  <button type="submit" class="btn btn-default" name="oblicz">Wyślij</button>
</form>

<script>

document.querySelector('select[name=kategoria]').addEventListener('change', function (evt) {
    var kat = evt.target;
    var kat_sel = kat.options[kat.selectedIndex].value
    document.querySelector('select[name=produkt]').innerHTML = produkts[kat_sel];
})

</script>

Mocked up JSFiddle demo.

2表格（选择） - 1取决于2

2 个答案: