Question

我使用以下示例构建我的kendo网格，我想使用切换按钮或链接折叠和展开。我研究过，我发现了一个使用函数（ToggleAllKendoGridDetailRows）扩展和折叠网格的例子，但是我收到错误，说tbody未定义。我试着调试，我注意到var grid = $（'＃Grid'）。data（'kendoGrid'）;网格也是未定义但我看到我的网格表工作正常。能帮忙吗？

可以在此处找到示例http://dojo.telerik.com/IKIN ....

    <div id="example">
        <div id="grid"></div>

      <a href="#" class="toggleDetail" title="Expand all rows" onclick="ToggleAllKendoGridDetailRows('expand');">Toggle</a>

        <script>
            $(document).ready(function() {
                var element = $("#grid").kendoGrid({
                    dataSource: {
                        type: "odata",
                        transport: {
                            read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Employees"
                        },
     ....
                        },
                        {
                            field: "Title"
                        }
                    ]
                });
            });

           function ToggleAllKendoGridDetailRows(direction) {
                //Get a collection of all rows in the grid
                var grid = $('#Grid').data('kendoGrid');
                var allMasterRows = grid.tbody.find('>tr.k-master-row');

                //Loop through each row and collapse or expand the row depending on set    deriction
                if (direction == 'collapse') {
                    $(".toggleDetail").attr("onclick", "ToggleAllKendoGridDetailRows('expand')");
                    $(".toggleDetail").text("Expand all rows");
                    for (var i = 0; i < allMasterRows.length; i++) {
                        grid.collapseRow(allMasterRows.eq(i));
                    }
                } else if (direction == 'expand') {
                    $(".toggleDetail").attr("onclick", "ToggleAllKendoGridDetailRows('collapse')");
                    $(".toggleDetail").text("Collapse all rows");
                    for (var i = 0; i < allMasterRows.length; i++) {
                        grid.expandRow(allMasterRows.eq(i));
                    }
                }
            }

            function detailInit(e) {
                $("<div/>").appendTo(e.detailCell).kendoGrid({
                    dataSource: {
                        type: "odata",
                        transport: {
                            read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
                        },

...... }）; } .....

Answer 1

您的网格以非资本'G'命名。您还需要阻止点击超链接的默认行为。

更新了示例here。

如何扩展和折叠Kendo Hierarchy网格

1 个答案: