MVC剑道UI网格- 100 +列



我有一个剑道UI GRID (MVC)与100+列。并非所有列在加载时都是可见的。默认的可见列是10列。在网格旁边的页面上有一些复选框,其中列出了所有列。如果单击复选框,则根据复选框是选中还是未选中,显示或隐藏该列。麻烦的是,当行数也很大(并且时间增加)时,网格几乎需要20秒来渲染。处理大量列的最佳方法是什么?

我认为把所有的100列用于一个记录并不是最好的工作方式。也许您必须为所有记录提供最重要的信息(最多10列),并具有详细视图(与您想要检查的特定记录的其余信息)

如果您想查看更详细的示例,请查看此处

我的方法如下

@(Html.Kendo().Grid<YOURCLASS>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(e => e.imporantColumn1);
        columns.Bound(e => e.imporantColumn2);
        columns.Bound(e => e.imporantColumn3);            
    })
    .Sortable()
    .Pageable()
    .Scrollable()
    .ClientDetailTemplateId("template")
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(5)
        .Read(read => read.Action("HierarchyBinding_theBasicData", "Grid"))
    )
    .Events(events => events.DataBound("dataBound"))
)

和详细模板

<script id="template" type="text/kendo-tmpl">
    @(Html.Kendo().TabStrip()
            .Name("tabStrip_#=ID#")
            .SelectedIndex(0)
            .Items(items =>
            {
                items.Add().Text("details").Content(@<text>
                    @(Html.Kendo().Grid<YOURCLASS>()
                        .Name("grid_#=ID#")
                        .Columns(columns =>
                        {
                            // the order columns
                        })
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .PageSize(5)
                            .Read(read => read.Action("HierarchyBinding_theRestOfInfo", "Grid", new { ID= "#=ID#" }))
                        )
                        .Pageable()
                        .Sortable()
                        .ToClientTemplate())
                </text>                        
                );               
            })
            .ToClientTemplate())
</script>

最新更新