jqgrid treeGrid nested adjacency

`jqGrid` 的 `treeGrid` 功能允许创建具有嵌套层级关系的数据网格，即所谓的 "nested adjacency"。当你设置 `gridview` 选项为 `false` 或不指定时，并启用 `treeGrid` 配置，jqGrid 将会构建一个可以展开和折叠行的树形结构。每一行都可以有子行，形成一个层次结构。

如果你想要实现这种嵌套的邻接性，你需要按照以下步骤配置：

1. **下载必要的组件**[^1]：确保从官方网站下载包含了 `grid.treegrid.js` 文件的版本，因为这是实现树形功能的核心脚本。

2. **启用treeGrid插件**：在初始化 jqGrid 时，明确地启用 `treeGrid` 功能，如：

   $("#your_grid_id").jqGrid({
       datatype: 'json',
       url: 'your_data_url',
       treeGrid: true,
       // 其他常规配置...
   });

3. **数据格式**：你的数据需要支持嵌套结构，通常包含一个额外的属性用于表示节点之间的父子关系，比如 `parent_id` 或者 `children` 属性。

4. **树形操作**：通过调用 `treeGrid蜷缩/展开` 方法 (`collapseRow()` 和 `expandRow()`), 可以控制特定行的显示状态。

相关问题

jqgrid TreeGrid adjacency模式使用

jqGrid TreeGrid 支持两种模式：嵌套模式（nested）和相邻模式（adjacency）。相邻模式是指表格数据中每个节点除了包含自身信息外，还包含其父节点的信息。以下是在 jqGrid TreeGrid 中使用相邻模式的基本步骤：

1. 定义表格列模型，包括节点 ID、节点名称、父节点 ID 等列。例如：

colModel: [
    { name: 'id', width: 50, key: true },
    { name: 'name', width: 150 },
    { name: 'parent', width: 50, hidden: true }
]

2. 加载表格数据，数据中每个节点应包含其父节点 ID。例如：

var data = [
    { id: 1, name: 'Node 1', parent: null },
    { id: 2, name: 'Node 2', parent: 1 },
    { id: 3, name: 'Node 3', parent: 1 },
    { id: 4, name: 'Node 4', parent: null },
    { id: 5, name: 'Node 5', parent: 4 },
    { id: 6, name: 'Node 6', parent: 4 }
];

$("#treegrid").jqGrid({
    data: data,
    datatype: "local",
    colModel: [
        { name: 'id', width: 50, key: true },
        { name: 'name', width: 150 },
        { name: 'parent', width: 50, hidden: true }
    ],
    treeGrid: true,
    treeGridModel: "adjacency",
    ExpandColumn: 'name',
    ExpandColClick: true,
    caption: "TreeGrid Example"
});

3. 配置 TreeGrid 相关参数，包括 treeGrid、treeGridModel 以及 ExpandColumn 等参数。

以上示例中的 treeGrid 参数设置为 true，表示启用 TreeGrid 功能；treeGridModel 参数设置为 adjacency，表示使用相邻模式；ExpandColumn 参数设置为 'name'，表示使用名称列作为展开节点的列。

4. 启用 TreeGrid 功能，例如：

$("#treegrid").jqGrid('setGridParam', {treeGrid: true}).trigger('reloadGrid');

通过以上步骤，你就可以在 jqGrid TreeGrid 中使用相邻模式来展示树形数据了。需要注意的是，相邻模式的数据结构相对复杂，需要根据具体需求进行调整。

jqgrid TreeGrid adjacency模式 使用c# 怎么实现

在 C# 中使用 jqGrid TreeGrid 的相邻模式，需要按照以下步骤进行：

1. 定义表格列模型，包括节点 ID、节点名称、父节点 ID 等列。例如：

colModel: [
    { name: "id", index: "id", width: 50 },
    { name: "name", index: "name", width: 150 },
    { name: "parent", index: "parent", width: 50, hidden: true }
]

2. 加载表格数据，数据中每个节点应包含其父节点 ID。例如：

var data = new[] {
    new { id = 1, name = "Node 1", parent = (int?)null },
    new { id = 2, name = "Node 2", parent = 1 },
    new { id = 3, name = "Node 3", parent = 1 },
    new { id = 4, name = "Node 4", parent = (int?)null },
    new { id = 5, name = "Node 5", parent = 4 },
    new { id = 6, name = "Node 6", parent = 4 }
};

var jsonData = new {
    total = 1,
    page = 1,
    records = data.Length,
    rows = data
};

return Json(jsonData, JsonRequestBehavior.AllowGet);

以上示例中的 data 数组中每个节点都包含其父节点 ID。在返回数据时，需要将数据转换为 JSON 格式，并包含 total、page、records 以及 rows 四个属性。其中，rows 属性对应表格的数据。

3. 配置 TreeGrid 相关参数，包括 treeGrid、treeGridModel 以及 ExpandColumn 等参数。

var gridModel = new {
    treeGrid = true,
    treeGridModel = "adjacency",
    ExpandColumn = "name",
    ExpandColClick = true,
    caption = "TreeGrid Example",
    colModel = new[] {
        new { name = "id", index = "id", width = 50 },
        new { name = "name", index = "name", width = 150 },
        new { name = "parent", index = "parent", width = 50, hidden = true }
    }
};

return Json(gridModel, JsonRequestBehavior.AllowGet);

4. 在前端页面中使用 jqGrid TreeGrid 插件来展示数据。例如：

$("#treegrid").jqGrid({
    url: "/Controller/Action",
    datatype: "json",
    mtype: "GET",
    colModel: [
        { name: "id", index: "id", width: 50 },
        { name: "name", index: "name", width: 150 },
        { name: "parent", index: "parent", width: 50, hidden: true }
    ],
    treeGrid: true,
    treeGridModel: "adjacency",
    ExpandColumn: "name",
    ExpandColClick: true,
    caption: "TreeGrid Example"
});

通过以上步骤，你就可以在 C# 中使用 jqGrid TreeGrid 的相邻模式来展示树形数据了。需要注意的是，相邻模式的数据结构相对复杂，需要根据具体需求进行调整。