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

Question

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

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

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

我目前有以下代码,但它创建了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)
                                );

            });
        });

任何帮助,将不胜感激!

Answer 1

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

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

完整代码

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