如何将此 Json 数组转换为 JQuery 可读的格式

How can I convert this Json array to a format readable by JQuery?

本文关键字:JQuery 格式 转换 Json 数组      更新时间:2023-09-26
有点

模糊的问题,但我不确定我该如何工作。Firebug 说我的 ajax 请求中的 Json 对象(数组?)看起来像:

{
"jsonResult":
"[
   {'"OrderInList'":1},
   {'"OrderInList'":2}
]"
}

这是通过 $.getJSON ajax 请求检索的:

    $.getJSON("/Json/GetOrderSelectList?parentCategoryId=" + postData, testData, function (jsonResult) {
        $('#orderInList option').remove();
        var map = {
            "TestKey1": "TestValue1",
            "TestKey2": "TestValue2"
        };
        $.each(jsonResult, function (key, value) {
            $("#orderInList").append($("<option value=" + key + ">" + value + "</option>")
            );
        });

如果我将 $.each(jsonResult) 替换为 $.each(map),则选择列表会正确填充。否则,我的选择列表只会说"未定义"。

我在 MVC 控制器中序列化此操作中的 Json:

    public JsonResult GetOrderSelectList(int parentCategoryId)
    {
        var result = Session
            .QueryOver<Category>()
            .Where(x => x.Parent.Id == parentCategoryId)
            .OrderBy(x => x.OrderInList).Asc
           .List();
        var toSerialize =
            result.Select(r => new {r.OrderInList});
        var jsonResult = JsonConvert.SerializeObject(toSerialize);                             
        return Json(new
                        { jsonResult,
                        }, JsonRequestBehavior.AllowGet);
    }

所以我认为问题可能是操作响应的 Json 格式?任何帮助表示赞赏!

编辑答案

下面的两个答案都帮助了我。我似乎无法强烈键入变量 jsonResult,因此感谢@JBabey指出我在读取 json 属性时的错误,并在 $.each 语句中建议函数(键、值)。

感谢@Darin迪米特洛夫帮助整理我的控制器!

您的控制器操作是错误的。您在其中手动进行 JSON 序列化,然后将其作为 JSON 结果返回,从而最终获得双 JSON 序列化。您可以直接返回数组,并将 JSON 序列化管道留给 ASP.NET MVC 框架:

public ActionResult GetOrderSelectList(int parentCategoryId)
{
    var result = Session
        .QueryOver<Category>()
        .Where(x => x.Parent.Id == parentCategoryId)
        .OrderBy(x => x.OrderInList)
        .Asc
        .List();
    return Json(result, JsonRequestBehavior.AllowGet);
}

然后:

$.getJSON("/Json/GetOrderSelectList?parentCategoryId=" + postData, testData, function (jsonResult) {
    $('#orderInList option').remove();
    $.each(jsonResult, function () {
        $('#orderInList').append(
            $("<option value=" + this.Id + ">" + this.Value + "</option>")
        );
    });
});

请注意,我在这里使用的是this.Idthis.Value。这假设 JSON 结果如下所示:

[{"Id": 1, "Value": "some value"}, {"Id": 2, "Value": "some other value"}]

您必须根据实际Category模型调整这些属性名称。

您将 ajax 返回的数据属性与数据本身混淆了。 如果您更正此问题,$.each将正常工作。

返回的数据如下所示:

{
    "jsonResult": "[
        {'"OrderInList'":1},
        {'"OrderInList'":2}
    ]"
}

这意味着这是传递给成功函数的对象。称它为data而不是jsonResult

function (data) {
    ...
    $.each(data.jsonResult, function (key, value) {
        ...
    });
});

此外,您的数组以字符串形式出现,因此您可能需要先解析它,然后$.each才能迭代它。