如何在 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中文网其他相关文章！