如何通过一次单击将一个列表框值传递到另一个列表框

时间:2013-03-19 07:29:40

标签: php javascript html mysql listbox

我正在使用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

请帮帮我

由于

2 个答案:

答案 0 :(得分:0)

试试这个: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);
                }
            }
        });

    })

答案 1 :(得分:0)

我建议您在第一个列表框中实现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>