Question

我在书店网站上有三张桌子。类别，子类别和书籍我想在将数据插入书籍表时选择类别和相关子类别但是子类别无法从类别中获取id并且未在列表中显示任何子类别我的代码是：

<th scope="col">Select Category</th>
<th scope="col"><select name="cat">
<?php
include("config.php");
$catsql = "SELECT * FROM categories;";
$catres = mysql_query($catsql);
while($catrow= mysql_fetch_assoc($catres)) {
echo "<option value='" . $catrow['id']
. "'>" . $catrow['cat'] . "</option>";
}
?>

</select></th>
</tr>
<tr>
<th scope="col">Select Subcategory
</th>
<th scope="col"><select name="subcat">
<?php
$cat=$catrow['id'];
$subsql="select * from subcat where catid=$cat;";
$subrs=mysql_query($subsql);
while($subrow=mysql_fetch_array($subrs)){
echo "<option value='" . $subrow['id']
. "'>" . $subrow['subcat'] . "</option>";

}
?>
</select>
</th>

Answer 1

当用户选择任何类别来填充子类别下拉列表时，您应该使用Ajax调用。

Answer 2

我使用java脚本完成了这个：

    <?php
    $db = new mysqli('localhost','root','','sha');
    $query = "SELECT * FROM categories;";
    $result = $db->query($query);

  while($row = $result->fetch_assoc()){
    $categories[] = array("id" => $row['id'], "val" => $row['cat']);
  }

  $query = "SELECT id, catid, subcat FROM subcat";
  $result = $db->query($query);

  while($row = $result->fetch_assoc()){
    $subcats[$row['catid']][] = array("id" => $row['id'], "val" => $row['subcat']);
  }

  $jsonCats = json_encode($categories);
  $jsonSubCats = json_encode($subcats);


?>

<!docytpe html>
<html>

  <head>
    <script type='text/javascript'>
      <?php
        echo "var categories = $jsonCats; \n";
        echo "var subcats = $jsonSubCats; \n";
      ?>
      function loadCategories(){
        var select = document.getElementById("categoriesSelect");
        select.onchange = updateSubCats;
        for(var i = 0; i < categories.length; i++){
          select.options[i] = new Option(categories[i].val,categories[i].id);          
        }
      }
      function updateSubCats(){
        var catSelect = this;
        var catid = this.value;
        var subcatSelect = document.getElementById("subcatsSelect");
        subcatSelect.options.length = 0; //delete all options if any present
        for(var i = 0; i < subcats[catid].length; i++){
          subcatSelect.options[i] = new Option(subcats[catid][i].val,subcats[catid][i].id);
        }
      }
    </script>

  </head>

  <body onload='loadCategories()'>
  <form action="storebooks.php" method="post"><table><tr><th scope="col">Select Category</th>
    <th scope="col"><select id='categoriesSelect' <select name="cid">
    </select></th>
  </tr>
<tr>
    <th scope="col">Select Subcategory
    </th>
    <th scope="col">
    <select id='subcatsSelect' name="subcatid">
    </select></th>
  </tr>
  <tr>
    <th scope="col"><p>Title</p></th>
    <th scope="col"><input name="title" type="text" /></th>
  </tr>
  <tr>
    <th scope="col">Author</td>
    <th scope="col"><input type="text" name="author" id="author" /></td>
  </tr>
  <tr>
    <td>description</td>
    <td><textarea name="bookdesc" cols="30" rows="15"></textarea></td>
  </tr>
  <tr>
    <th scope="col"><p>keywords</p></th>
    <th scope="col"><input name="keywords" type="text" /></th>
  </tr>
   <tr>
    <th scope="col"><p>Image</p></th>
    <th scope="col"><input name="image" type="text" /></th>
  </tr>
  <tr>
    <th scope="col"><p>Order</p></th>
    <th scope="col"><input name="order" type="text" /></th>
  </tr>
    <tr>
    <td></td>
    <td><input name="submit" type="submit" value="submit" id="submit" /></td>
  </tr>
</table>
</form>

</body>
</html>

在将数据插入books表时选择类别和子类别

2 个答案: