填充基于使用AJAX JSON的另一个下拉列表中的下拉列表 [英] Populate a dropdown list based on the another dropdown list using AJAX JSON

问题描述

我知道这个问题已经被问许多过，但我不能让类似我的问题一个确切的解决方案。

I know that this question has been asked by many before but I could not get an exact solution that resembles to my question.

我有一个下拉列表叫分类和另一个下拉，而一个子一个叫做等级。 当我选择一个类别（比方说，我选择电视输出收音机，洗衣机，DVD播放器等），则相应的等级，以该类别（比方说电视 - 索尼，日立，三星，飞利浦..）应该填充在等级下拉列表。但两者的类别和等级正在从数据库中获取和查询工作完美。

I have a dropdown list called Category and a another dropdown rather a sub one called Grade. As I select a Category(Lets say I select TV out of radio,washing machines,dvd players etc.), then the corresponding grades to that category(Lets say TV - Sony, Hitac Samsung, Philips..) should populate on the grade dropdown. But both the categories and grades are being fetched from the database and the queries are working perfectly.

AJAX： -

<script>
        function getGradeDetails(category){
            if(category!==""){
                var request = $.ajax({
                    url: "../controller/sales.php",
                    type: "POST",
                    data: {category:category,action:'get_grade_details'},  
                    dataType: "json"
                });
                request.done(function(json_return){    
                    //alert(json_return['grade_desc']);
                    $( "#grade" ).append( "<option>"+json_return['grade_desc']    </option>" );
                }); 
                request.fail(function(jqXHR, textStatus) {
                    alert( "Request failed: " + textStatus );
                    return false;
                });
            }
            else{
                $("#grade").append('<option></option>');
            }
        }
</script>

HTML： -

<td>Category
    <select name="category" id="category" onchange="getGradeDetails(this.value)">
        <option></option>
        <?php 
           require_once '../model/sales.php';
           @$result=Sales::getAllCategories();
           while($value=  mysql_fetch_assoc($result)){
        ?>
        <option value="<?php echo $value['category_code']; ?>">
            <?php echo $value['category_desc'] ?>
        </option>
        <?php } ?>
    </select>
</td>

<td>Grade
<td>
   <select id="grade">
   </select>
</td>

控制器： -

<?php 
    require_once '../model/sales.php';
    $action=$_REQUEST['action'];

    switch($action){
        case 'get_grade_details':
            getGradeDetails();
            break;
        default :
            break;
    }        
    function getGradeDetails(){
        $category=$_POST['category'];
        require_once '../model/sales.php';
        $obj=new Sales();
        $result=mysql_fetch_assoc($obj->getGradesForCategory($category));
        echo json_encode($result);
        exit;
    }
?>

根据这个code，上档次的下拉值也只得到从DB的第一个值。例如： - 只有索尼，它避免了其他人，日立，三星等。 而且因为我更改其他类别（例如： - 洗衣机机），那么等级下拉具有价值的索尼（电视级），LG（洗衣机级）

According to this code, the dropdown value on the grade does get only the first value from the DB. Eg:-Only Sony, and it avoids others-HitacSamsung etc.. And moreover as I change on another category(Eg:-Washing Machines), then the Grade dropdown has values Sony(TV Grade),LG(Washing Machines Grade).

我要的是： -

1）的值应显示作为一个整体而不仅仅是第一/单从DB值

1) The values should appear as a whole not just the first/single value from the DB.

2）正如我在种类变更（电视洗衣机），然后这些值与电视不应该出现（索尼），并只值那些有关的洗衣机（LG）应该会出现。

2) As i change on the category(TV to Washing Machines), then values relating to TV should not appear(Sony) and only values that are pertaining to the washing machines(LG) should appear.

推荐答案

现在的问题是，你是不是循环和响应列表中添加所有的项目都选择标签的选项

The problem is that you are not looping and adding all the items on the response list to the options of the select tag

request.done(function(json_return){    
                //alert(json_return['grade_desc']);
                **$( "#grade" ).append( "<option>"+json_return['grade_desc']</option>"**     );
            });

的突出部分应当修正为所有的值都被添加作为选择，像

The highlighted portion should be corrected so as all the values are being added as options, something like

var options = '';

for (i=0;i< json_return['grade_desc'].length;i++){
   options += "<option>"+json_return['grade_desc'][i]+"</option>";
}
$("#grade").append(options);

第二个问题，需要更多的信息。请张贴从阿贾克斯响应的一个片段。

The second question needs more information. Please post a snippet of the response from ajax.

这篇关于填充基于使用AJAX JSON的另一个下拉列表中的下拉列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！