Question

我无法让我的JQGrid treegrid正确扩展。它是一个分层邻接网格。

当我展开根节点时，子节点会正确展开和缩进，但它们不会直接放在节点下面。

我的json数据有问题吗？我希望首先出现可扩展的节点，并在它们下面显示叶节点。

示例在这里：http://jsfiddle.net/yNw3C/3194/（我已经重命名了所有节点bob，但仍然可以看到奇怪的扩展行为）

$(function () {

    var mydata = [{"id":"5a1a9743-3e0f-11d3-941f-006008032006","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"9042ded8-09ee-46f9-beac-8746ed1cdd17","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"29846baa-ede0-4582-b9ed-39bcc486f2c2","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":false,"expanded":false,"loaded":true},{"id":"39cc2783-811f-4885-9af6-d35b1a1385a2","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"3061ce07-bff6-4d9a-a84a-a8a7d47ebd7a","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"d1f870ed-bca6-4cc8-8b96-b19fa251c2f8","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"5a1a9742-3e0f-11d3-941f-006008032006","name":"bob","level":0,"parent":null,"isLeaf":false,"expanded":false,"loaded":true},{"id":"c80ca2d1-8210-4c11-8c6d-005c97fce9cb","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"d9dadce8-a9ce-4343-a8a0-b80844aa36ad","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"b3bc918c-4fa6-4470-afdd-d98e3586d434","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":false,"expanded":false,"loaded":true},{"id":"466d78df-6f39-43ff-abfd-58e7bf91f8c8","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true},{"id":"be4c23b9-41a2-482f-a37a-33379ea03344","name":"bob","level":1,"parent":"5a1a9742-3e0f-11d3-941f-006008032006","isLeaf":true,"expanded":false,"loaded":true}];                


    $("#treegrid").jqGrid({
    datatype: "jsonstring",
        datastr: mydata,
    colNames: ["id", "partners"],
    colModel: [
                { name: 'id', index: 'id', hidden: true, key: true },
                { name: 'name', index: 'name', width: 500, sortable: false, classes: 'pointer' },                       
    ],
    height: 'auto',
    gridview: true,
    rowNum: 10000,
    sortname: 'name',
    treeGrid: true,
    treeGridModel: 'adjacency',           
    ExpandColumn: 'name',
    jsonReader: {
        repeatitems: false,
        root: function (obj) { return obj; },
        page: function (obj) { return 1; },
        total: function (obj) { return 1; },
        records: function (obj) { return obj.length; }
    }
});        

});

Answer 1

这只是一个小小的误解，jqGrid如何构建TreeGrid。您必须提供已排序数据作为输入。 jqGrid只是将所有行完全按照输入中的顺序放置到网格中。折叠的行将只是隐藏。如果用户展开节点，则jqGrid将显示将扩展节点作为父节点的所有行。

因此，要解决问题，您必须求助输入数据，以便所有直接子项都应该跟随父项。可能你还需要包括不是叶子的第一个节点（有isLeaf: false），然后是叶子的子节点（有isLeaf: true）。此外，您应该按sortname选项（在您的案例中按"name"列）对所有节点进行排序。

顺便说一下，您可以从id中删除colModel列。 jqGrid默认使用输入数据的id属性作为rowid的输入（网格的id元素的<tr>属性的值）。

请参阅更新演示http://jsfiddle.net/yNw3C/3204/

Answer 2

目前，jqGrid只能处理从服务器返回的数据。

http://www.trirand.com/jqgridwiki/doku.php?id=wiki%3atreegrid#options

创建一个返回JSON的简单网页。

JQGrid treegrid没有按预期扩展

2 个答案: