如何在 jqGrid 中顯示間接資料（例如 ID 中的城市名稱）？

jqGrid：處理間接資料顯示

在處理表格資料時，經常需要從不同的表格中顯示資料。例如，您有一個主表包含學生姓名和城市 ID，另一個表將城市 ID 對應到實際城市名稱，這時您可能需要在網格中顯示城市名稱而不是城市 ID。

直接連接方法的限制

一種常見的方法是根據城市 ID 欄位連接這些表。但是，如果您使用的是包含城市 ID 欄位而不是實際城市名稱的類別結構，這種方法就變得不切實際。

解：使用查找函數解碼 ID

為了解決這個問題，jqGrid 提供了 formatter: "select" 函數。此函數可讓您將城市 ID 解碼為對應的城市名稱。但是，它需要一個值映射來執行此解碼，並且需要在 jqGrid 處理伺服器回應之前設定此映射。

建議的方法是使用額外的 editoptions.value 屬性資料來擴展您的伺服器回應，該屬性將用於使用 "select" 格式化程式的欄位。此擴充響應可以採用以下格式：

<code class="language-json">{
    "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 class="language-javascript">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>

這種方法可讓您根據從伺服器接收的資料動態設定列選項。它還使您可以靈活地實現更複雜的場景，例如指定語言首選項或處理選擇元素中的大量項目。

以上是如何在 jqGrid 中顯示間接資料（例如 ID 中的城市名稱）？的詳細內容。更多資訊請關注PHP中文網其他相關文章！