如何使用扩展 JSON 响应动态填充 jqGrid 选择选项？

在jqGrid中显示间接数据

jqGrid提供“select”格式化程序来显示间接数据。但是，此格式化程序在动态填充选项方面存在局限性。为了克服这个问题，可以扩展来自服务器的JSON响应，以包含用于填充选择选项的附加数据。

原始问题：

数据结构如下：

SID	SNAME	CITY
1	ABC	11
2	XYZ	12
3	ACX	13
4	KHG	14
5	ADF	15
6	KKR	16

另一个表提供城市名称：

CID	CNAME
11	Chennai
12	Mumbai
13	Delhi

目标是将数据显示为：

SID	SNAME	CITY
1	ABC	Chennai
2	XYZ	Mumbai
3	ACX	Delhi
4	KHG	Banglore
5	ADF	Hyderabad
6	KKR	Kolkatta

使用扩展JSON响应的解决方案：

服务器可以扩展JSON响应，以包含一个“cityMap”属性，该属性将城市ID映射到城市名称：

<code>{
    "cityMap": {"11": "Chennai", "12": "Mumbai", "13": "Delhi"},
    "rows": [
        { "SID": "1",  "SNAME": "ABC", "CITY": "11" },
        { "SID": "2",  "SNAME": "XYZ", "CITY": "12" },
        { "SID": "3",  "SNAME": "ACX", "CITY": "13" },
        { "SID": "4",  "SNAME": "KHG", "CITY": "13" },
        { "SID": "5",  "SNAME": "ADF", "CITY": "12" },
        { "SID": "6",  "SNAME": "KKR", "CITY": "11" }
    ]
}</code>

jqGrid配置：

<code>colModel: [
    {name: "SNAME", width: 250},
    {name: "CITY", width: 180, align: "center"}
],
beforeProcessing: function (response) {
    var $self = $(this);
    $self.jqGrid("setColProp", "CITY", {
        formatter: "select",
        edittype: "select",
        editoptions: {
            value: $.isPlainObject(response.cityMap) ? response.cityMap : []
        }
    });
},
jsonReader: { id: "SID"}</code>

这种方法允许根据服务器的数据动态填充选择选项。它还可以用于根据服务器数据动态设置其他列选项。

以上是如何使用扩展 JSON 响应动态填充 jqGrid 选择选项？的详细内容。更多信息请关注PHP中文网其他相关文章！