根据下拉列表中的选择使用jQuery填充变量

时间:2014-04-01 14:50:33

标签: javascript jquery json

我正在尝试根据用户从下拉菜单中选择在jQuery中构建嵌套数组。这将在以后的JSON请求中使用。

到目前为止,我的代码确实产生了(差不多)所需的结果,但无论顺序我从下拉菜单中选择选项,输出(我在最后登录控制台)始终是相同的。

  $('#comboGenre').change(function () {
     var values = $('#comboGenre').val();
     var parsedJSON = JSON.parse($data); //Data returned from ajax request
     for (var i = 0; i < values.length; i += 1) {
         $genreList = parsedJSON.genre[i];
         console.log($genreList);
     }
 });

所以如果我从我的下拉菜单中选择RPG和Action,输出会给我RPG和Driving。如果我选择了RPG,驾驶和行动(按此顺序),我会得到我期望的RPG,驾驶和动作。

所以它只是迭代我的JSON,真的应该返回'selected'选项。

我怎样才能实现这个目标?

如果它有用,我的JSON看起来像这样:

 {"genres": [{
        "genre": "RPG",
        "publishers": [{
            "publisher": "Square",
            "games": [{
                "game": "FFX",
                "rating": [
                    12, 15
                ]
            }]
        }]
    }, 
            {
        "genre": "Driving",
        "publishers": [{
            "publisher": "Turn10",
            "games": [{
                "game": "Forza",
                "rating": [
                    5
                ]
            }]
        }]        
    },
    {
        "genre": "Action",
        "publishers": [{
            "publisher": "EA",
            "games": [{
                "game": "COD",
                "rating": [
                    18, 20
                ]
            }]
        }]        
    }        
]}

编辑:

我也试过这个:

 $('#comboGenre').change(function () {
     var parsedJSON  = JSON.parse($data);
     $genreList = "";
     $.each(parsedJSON.genres, function(index, value){
     $genreList = parsedJSON.genres[index];
     console.log($genreList);
     });
 });

我最终得到了JSON中的所有对象,所以从这里开始,我只想将所选对象添加到$genreList变量中。

1 个答案:

答案 0 :(得分:1)

如果您突破了一些逻辑并创建了一个类型查找功能并使用所选字符串找到正确的对象,那么您可以将该对象放入稍后将使用的变量中。我做了一些检查以确保已经选择的类型不在我的数组中,这是因为我使用的是多重选择

JSFiddle:http://jsfiddle.net/vkTFq/

代码:

$(function(){
var selectedGenres = []; 
var genres =[{"genre":"RPG","publishers":[{"publisher":"Square","games":[{"game":"FFX","rating":[12,15]}]}]},{"genre":"Driving","publishers":[{"publisher":"Turn10","games":[{"game":"Forza","rating":[5]}]}]},{"genre":"Action","publishers":[{"publisher":"EA","games":[{"game":"COD","rating":[18,20]}]}]}]
    $('#comboGenre').change(function() {

        $(this).find(":selected").each(function() {
            var selectedGenre = findGenre($(this).val())

            if (!genreAlreadySelected(selectedGenre.genre)) {
                selectedGenres.push(selectedGenre);
            };


        });
        console.log (JSON.stringify(selectedGenres));
    });

    function genreAlreadySelected(genre){
        for(var i = 0; i < selectedGenres.length; i++){
            if (genre == selectedGenres[i].genre) {
                return true;
            };
            return false;
        }
    }

    function findGenre(genre){
        for(var i = 0; i < genres.length; i ++){
            console.log(genre)
            if(genre == genres[i].genre){
                return genres[i];
            }
        }

    };


});