jqGrid treeGrid展开折叠不起作用

Question

我正在尝试使用 jqGrid 4.2.1 设置一个 treeGrid，经过一些视觉效果看起来不错，但扩展折叠不起作用。只有图标切换，但组保持可见。

设置如下

    $("#list").jqGrid({
                treeGrid: true,
                treeGridModel: 'adjacency',
                ExpandColumn: 'BreakdownTag',
                ExpandColClick: true,
                url: '/AsyncData/Breakdown.ashx',
                datatype: 'json',
                mtype: 'GET',
                colNames: ['Superior Tag', 'Breakdown Tag', 'Tag Description'],
                colModel: [
                    { name: 'SuperiorTag', id: 'SuperiorTag', index: 0, width: 250, 
hidden: true, align: 'left', sortable: false, classes: 'indeling', title: false },
                    { name: 'BreakdownTag', id: 'BreakdownTag', index: 1, width: 250,
 align: 'left', sortable: false, classes: 'indeling', title: false, visible: false },
                    { name: 'TagDescription', id: 'TagDescription', index: 2, width: 250,
 align: 'left', sortable: false, classes: 'indeling', title: false },],
                rowNum: 20000,
                viewrecords: true,
                loadui: "disable",
                emptyrecords: "Geen data gevonden...",
                height: "100%",
                treeIcons: { leaf: 'ui-icon-document-b' },
                loadonce: true,
                hoverrows: false
 }

            });

json对象为：

    {
    "total": 1,
    "page": 1,
    "records": 3,
    "rows": [
        {
            "i": 1,
            "cell": [
                "",
                "First",
                "Description for First",
                0,
                "null",
                false,
                true,
                true
            ]
        },
        {
            "i": 2,
            "cell": [
                "First",
                "Second",
                "Description for Second",
                1,
                "First",
                false,
                true,
                true
            ]
        },
        {
            "i": 3,
            "cell": [
                "Second",
                "Third",
                "Description for Third",
                2,
                "Second",
                false,
                true,
                true
            ]
        }
    ]
}

如前所述，在单击一个节点以将其折叠（evreything 显示 expandend）之前，一切看起来都很好，图标切换，但行保持可见。 我现在有点不知所措......

Answer 1

JSON 数据有两个错误，JavaScript 代码有一个小错误。

在 JSON 数据中，您应该使用 id 而不是 i 作为项目 ID。要指定父元素，您应该使用 id 而不是 'BreakdownTag' 列中的值（在下面的示例中使用 2 而不是“Second”）：

{
    "i": 3,
    "cell": [
        "Second",
        "Third",
        "Description for Third",
        2,
        "Second",
        false,
        true,
        true
    ]
}

应该固定为

{
    "id": 3,
    "cell": [
        "Second",
        "Third",
        "Description for Third",
        2,
        2,
        false,
        true,
        true
    ]
}

其他小的 JavaScript 错误是在 colModel 末尾使用尾随逗号。组合 },] 应替换为 }]。

The demo 在更改后可以正常工作。