ShieldUI网格-在运行时添加列 [英] ShieldUI Grid - Adding Columns at run-time

查看:105
本文介绍了ShieldUI网格-在运行时添加列的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

是否可以在运行时添加列?假设我有一个分页的数据集,在第1页上有4列,在第4页上有相同的4列,再加上在第2页上还有1个不同的列,那么在第3页上有与第1页相同的4列,但与第2页不同的是2列./p>


数据中的第1页列并显示为网格:

File, DocName, PrintDate, Event

数据中的第2页列并显示在网格中

File, DocName, PrintDate, Event, Person

数据中的第3页:

File, DocName, PrintDate, Event, RunDate, Designation

第3列显示在网格中

File, DocName, PrintDate, Event, Person, RunDate, Designation

在页面之间来回移动时,它们都将保留在网格中.

解决方案

您可以通过将最初将在网格中显示的所有列添加到所有页面来实现此目的.

然后,在加载网格时,使用以下功能隐藏对于第一页不可见的列: http://www.shieldui.com/documentation/grid/javascript/api/methods/hideColumn

然后为网格寻呼机附加一个更改"事件句柄:

$("#grid").swidget().pager.on("change", function(e) {
    var currentPage = this.currentPage;

    // hide the cols not supposed to be visible on this page 
    // and show the rest - using the grid's hideColumn() and 
    // showColumn() functions
    // ...
});

Is it possible to add columns at run-time? Suppose I have a paginated set of data that has 4 columns on page 1 and the same 4 columns PLUS 1 more different columns on page 2, then on page three have the same 4 columns as page 1 but 2 columns different than page 2.

i.e.
Page 1 columns in data and shown in grid:

File, DocName, PrintDate, Event

Page 2 columns in data and shown in grid:

File, DocName, PrintDate, Event, Person

Page 3 columns in data:

File, DocName, PrintDate, Event, RunDate, Designation

Page 3 columns shown in grid:

File, DocName, PrintDate, Event, Person, RunDate, Designation

And they will all remain in the grid when maneuvering back and forth between the pages.

解决方案

You can do this by adding all columns that are to be shown in the grid to all pages initially.

Then, when the grid is loaded, hide the columns that should not be visible for the first page, by using this function: http://www.shieldui.com/documentation/grid/javascript/api/methods/hideColumn

Then attach a "change" event handle for the grid pager:

$("#grid").swidget().pager.on("change", function(e) {
    var currentPage = this.currentPage;

    // hide the cols not supposed to be visible on this page 
    // and show the rest - using the grid's hideColumn() and 
    // showColumn() functions
    // ...
});

这篇关于ShieldUI网格-在运行时添加列的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆