如何使用擴充 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中文網其他相關文章！