php - 如何一键将一个列表框值传递给另一个列表框

Question

我正在使用 php 和 mysql 构建在线商店应用程序。我做了一个列表框，可以用来列出主要类别。一旦我们选择了主要类别，子类别应该会下来。我们如何在不按下按钮或重新加载页面的情况下完成这项任务。

列表框的代码

<select name="category" id="inputarealistproduct" onfocus="getsubcat();">
        <option> Select category</option>
    <?php 
        $query="select id, categories_name from categories where parent_id=0";
        $result=mysql_query($query);
        while(list($id, $name)=mysql_fetch_row($result)) 
        {
            echo "<option value=\"".$id."\">".$name."</option>";            
        }
    ?></select>

桌子设计是

id categories_name parent_id categories_sort

请帮帮我

谢谢

Answer 1

试试这个：Jquery + Ajax

 $('#inputarealistproduct').change(function () {
      var product =  $('#inputarealistproduct').val();
       $.ajax({
            url : 'url of your page where you ececute query',
            type : 'GET',
            data : {
                item : product
            },
            success : function (resp) {
                if (resp.status) {
                    // manipulate your response data here.
                } else {
                    show_message('error', resp.msg);
                }
            }
        });

    })

Answer 2

我建议您在第一个列表框上实现 onchange 事件，以便它使用该类别的子类别填充另一个列表框：

<select name="category" id="inputarealistproduct" onfocus="getsubcat();" onchange="GetSubCategories()">
        <option> Select category</option>
    <?php 
        $query="select id, categories_name from categories where parent_id=0";
        $result=mysql_query($query);
        while(list($id, $name)=mysql_fetch_row($result)) 
        {
            echo "<option value=\"".$id."\">".$name."</option>";            
        }
    ?></select>
<div id="result"></result>

在js中：

function GetSubCategories(){
   var categoryId = document.getElementById("inputarealistproduct").value;

   $.ajax({
            url : 'process.php',
            type : 'GET',
            data : "category=" + categoryId ,
            success : function (resp) {
                if (resp.status) {
                    $("#result").html(data);
                } 
            }
        });
}

在 process.php 中：

<?php
$category = $_GET["category"];
// change the query so that the column names match your subcategory table
$query="select id, sub_categories_name from subcategories where category_id=". $category;
$result=mysql_query($query);
?>

<select name="subcategory" id="subcategory">
            <option>Select sub category</option>
        <?php while(list($id, $name)=mysql_fetch_row($result)) 
            {
                echo "<option value=\"".$id."\">".$name."</option>";            
            }
        ?>
</select>