首页 >后端开发 >C++ >如何使用带有城市映射的 JSON 响应在 jqGrid 中显示多个表中的数据?

如何使用带有城市映射的 JSON 响应在 jqGrid 中显示多个表中的数据?

Mary-Kate Olsen
Mary-Kate Olsen原创
2025-01-23 07:11:38460浏览

How to Display Data from Multiple Tables in jqGrid Using a JSON Response with City Mapping?

jqGrid:处理多个相关表中的数据

jqGrid,一个强大的 jQuery 插件,擅长显示来自各种来源的数据。此示例演示如何有效地呈现两个互连表中的数据:StudentsCities.

Students 表使用城市 ID 作为外键,引用 Cities 表获取城市名称:

<code>Students:
| SID | SNAME | CITY |
|---|---|---|
| 1 | ABC | 11 |
| 2 | XYZ | 12 |
| 3 | ACX | 13 |

Cities:
| CID | CNAME |
|---|---|
| 11 | Chennai |
| 12 | Mumbai |
| 13 | Delhi |</code>

所需的输出格式是一个jqGrid,显示学生信息和实际城市名称:

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

为了实现此目的,服务器端响应的结构包括一个 cityMap,它将城市 ID 转换为名称:

<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 代码利用 beforeProcessing 事件使用 cityMap 动态更新列属性。这可确保显示正确的城市名称。 这里没有直接使用formatter: "select"选项,但是运行时动态更新列选项的原理保持不变。

这是客户端代码的简化表示:

<code class="language-javascript">var filterToolbarOptions = {defaultSearch: "cn", stringResult: true, searchOperators: true},
    removeAnyOption = function ($form) { /* ... (function remains unchanged) ... */ },
    $grid = $("#list");

// ... (other code remains largely unchanged) ...

$grid.jqGrid({
    // ... (colModel remains largely unchanged) ...
    beforeProcessing: function (response) {
        // ... (logic to handle cityMap and update column properties) ...
    },
    jsonReader: { id: "SID"}
});
// ... (rest of the code remains largely unchanged) ...</code>

beforeProcessing 函数将在 jqGrid 渲染网格之前使用响应中的 cityMaprows 数据中的数字城市 ID 替换为相应的城市名称。 这种方法避免了复杂的客户端数据操作并保持逻辑简洁。

以上是如何使用带有城市映射的 JSON 响应在 jqGrid 中显示多个表中的数据?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn