如何使用JQuery从Json对象创建此选择列表？

Yeah I have 3 or 4 different answers on the same subject but I'm struggling to combine them to create what I need. I serialize my results using Json.Net which results in the following object:

是的我在同一主题上有3个或4个不同的答案,但我正在努力将它们结合起来创造我需要的东西。我使用Json.Net序列化我的结果,结果产生以下对象:

"[  { "Id": 1, "OrderInList": 1  },
    { "Id": 2, "OrderInList": 2  },
    { "Id": 4, "OrderInList": 3  }
]"

I'd like the option value and text to be the OrderInList value (I'll use the Id with something else later).

我希望选项值和文本是OrderInList值(稍后我将使用其他ID)。

I've currently got the following code, but it creates 143 option boxes. I can see why it's doing it, but I'm not sure how to alter it to get it to work.

我目前有以下代码,但它创建了143个选项框。我可以看到它为什么这样做,但我不确定如何改变它以使它工作。

    $.getJSON("/Json/GetOrderSelectList?parentCategoryId=" + postData, null, function (jsonResult) {
        $('#orderInList').attr('enabled', 'true');
        $.each(jsonResult, function() {
            $.each(this, function(index, item) {
                                $('#orderInList').append(
                                    $("<option></option>")
                                        .text(index)
                                        .val(index)
                                );

            });
        });

Any help would be appreciated!

任何帮助,将不胜感激!

2 个解决方案

#1

I think you're trying something like this:

我想你正在尝试这样的事情:

var jsonResult = [{
    "Id": 1,
    "OrderInList": 1},
{
    "Id": 2,
    "OrderInList": 2},
{
    "Id": 4,
    "OrderInList": 3}
]

$('#orderInList').attr('enabled', 'true');
$.each(jsonResult, function() {
   $('#orderInList').append(
        $("<option></option>").text(this.Id).val(this.OrderInList);
   );
});

DEMO

Full code

$.getJSON("/Json/GetOrderSelectList?parentCategoryId=" + postData, function(jsonResult) {
    $('#orderInList').attr('enabled', 'true');
    $.each(jsonResult, function() {
        $('#orderInList').append(
            $("<option></option>").text(this.Id).val(this.OrderInList)
        );
    });
});

#2

You do not need the extra call to .each that is nested within the first call to .each. Just pass the items and the index in the first .each call then create your element. Try this:

你不需要额外调用.each,它嵌套在第一次调用.each中。只需在第一个.each调用中传递项目和索引,然后创建元素。尝试这个:

var json = [  { "Id": 1, "OrderInList": 1  },
    { "Id": 2, "OrderInList": 2  },
    { "Id": 4, "OrderInList": 3  }
];

function createSelect(options){
    $.each(options,function(index,item){
           $("#orderInList").append($("<option></option>").attr("value", item.OrderInList).text(item.OrderInList));

    });
}

$(document).ready(function(){
createSelect(json);
});

Working Example: http://jsfiddle.net/BzC9N/

工作示例:http://jsfiddle.net/BzC9N/

#1