使用列菜单进行Kendo UI分组

时间:2013-02-10 07:34:41

标签: kendo-ui

我在使用Kendo gird同时进行分组和放大时遇到了一个问题。列菜单已启用。

当我们选择任何一个列进行分组时(比如ShipCountry),折叠所有行,从列菜单(列的右上角)取消选择任何列并展开行。 取消选择的列在内部网格中可见。列名称在标题中不可见。

我们甚至尝试处理列菜单的检查事件,手动显示或隐藏列 但这没有用。可以帮助解决这个问题。

以下是我的实施的代码段。

    <html>
<head>
    <title></title>
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://cdn.kendostatic.com/2012.3.1315/js/kendo.all.min.js"></script>
    <link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.default.min.css" rel="stylesheet" />
</head>
<body>

        <div id="example" class="k-content">
            <div id="grid"></div>

            <script>
                $(document).ready(function() {
                    $("#grid").kendoGrid({
                        dataSource: {
                            type: "odata",
                            transport: {
                                read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
                            },
                            schema: {
                                model: {
                                    fields: {
                                        OrderID: { type: "number" },
                                        ShipCountry: { type: "string" },
                                        ShipName: { type: "string" },
                                        ShipAddress: { type: "string" }                                        
                                    }
                                }
                            },
                            pageSize: 10,
                            serverPaging: true,
                            serverFiltering: true,
                            serverSorting: true
                        },
                        height: 250,
                        sortable: true,
                        filterable: true,
                        columnMenu: true,
                        pageable: true,
            groupable:true,
                        columns: [
                            "OrderID",
                            "ShipCountry",
                            "ShipName",
                            {
                                field: "ShipAddress",
                                filterable: false
                            }
                        ]
                    });
                });
            </script>
        </div>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

我确认这是一个错误。我已将其记录下来进行修复。