jqGrid系列：选择显示列

jqGrid支持用户自定义显示哪些列。官方实际上有两种实现方式。

一、columnChooser方法

这是官方现在推荐的实现方法。

demo >>New in version 3.6>>Column Chooser

具体怎么用，wiki里写的很清楚。http://www./jqgridwiki/doku.php?id=wiki:jquery_ui_methods

注意：实现demo的效果需要引入JQuery UI。

具体需要引入（我引得jqGrid，因为这是支持IE6的最后一个版本）：

View Code

二、setColumns方法

这种方式官方已经不再推荐，4.0以上版本也不再自带（需引入插件）

但由于我开发的系统早期引入了easyUI控件，与columnChooser方式依赖的JQuery UI会冲突，so。。。

（冲突时由于jquery-ui.min.js和jquery.easyui.min.js有相同的方法）

基本的实现看官方WIKI就够了。

需要引入：

查看文本打印

1. <script src="/js/jqGrid/src/grid.setcolumns.js" type="text/javascript"></script>  

实现效果如图

Submit和Cancel的国际化可以在i18n/grid.locale-en.js中找到

View Code

选项	解释	默认值
saveicon	该选项时一个数组元素，其默认值为[true,”left”,”ui-icon-disk”]，用于设置确认按钮。 第一个元素用于是否展示图标，第二个元素用于指定图标居左或局右显示，第三个元素用于指定图标（必须是UI theme roller）	[true,”left”,”ui-icon-disk”]

 

 

 

如果看按钮旁的小图标不爽，把saveicon和closeicon设为[false]就可以去掉。

“必须是UI theme roller”是指

原生的checkbox功能太弱，竟然没有全选的功能。被测试人员逼了两天，终于把这个小功能憋出来了。

需要改插件的源码(grid.setcolumns.js)，当然

 

View Code