jqgrid - 如何将嵌套的 JSON 绑定(bind)到同一行中的 Jqgrid

Question

{
    "InventoryId": "51",
    "AssetID": "23",
    "FieldData": [
        {
            "Field": "Field 1"
        },
        {
            "Field": "Field 2"
        },
        {
            "Field": "Field 3"
        },
        {
            "Field": "Field 4"
        }
    ]
}

这是我的 JSON 数据的一部分。如何将此数据绑定(bind)到 JQgrid？我需要
以下结构中的网格

AssetID | InventoryId | Field1 | Field 2 | Field 3 | Field 4
============================================================
        |             |        |         |         |
        |             |        |         |         |

Answer 1

一个必须生成colModel jsonmap 的元素格式为 jsonmap: "FieldData.0.Field" , jsonmap: "FieldData.1.Field" , jsonmap: "FieldData.2.Field"等等:

var mydata = [
        ...
    ],
    myColModel = [
        { name: "AssetID", label: "Asset ID", key: true,
            width: 70, template: "integer", frozen: true },
        { name: "InventoryId", label: "Inventory Id",
            width: 90, template: "integer", frozen: true }
    ];

for (i = 0; i < mydata[0].FieldData.length; i++) {
    myColModel.push({
        name: "field" + (i + 1),
        label: "Field " + (i + 1),
        jsonmap: "FieldData." + i + ".Field"
    });
}

$("#grid").jqGrid({
    data: mydata,
    colModel: myColModel,
    ...
});

对应的demo是 https://jsfiddle.net/OlegKi/ga9m44wm/

可以使用回调函数作为 jsonmap的值.例如，可以使用

jsonmap: function (item) {
    return item.FieldData[0].Field;
}

对于第一列，

jsonmap: function (item) {
    return item.FieldData[1].Field;
}

对于第二列，依此类推。为 jsonmap动态生成对应函数 colModel 的属性(property)可以使用闭包:

for (i = 0; i < mydata[0].FieldData.length; i++) {
    myColModel.push({
        name: "field" + (i + 1),
        label: "Field " + (i + 1),
        jsonmap: (function (index) {
            return function (item) {
                return item.FieldData[index].Field;
            }
        })(i)
    });
}

见 https://jsfiddle.net/OlegKi/ga9m44wm/1/

还有一些重要的事情，在从服务器加载数据和使用 loadonce: true 时必须遵循。选项。应该使用的附加选项取决于您使用的 jqGrid 的版本以及您使用的 jqGrid 的分支。我在演示中使用过 free jqGrid 4.13.5，jqGrid 的分支，我从 2014 年底开始开发的。因为你仍然使用复古版本 4.3.3，所以我试图提供代码，它只使用了 jqGrid 最古老的功能。