javascript - 如何使用 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)
        );
    });
});​