jqGrid ColumnChooser是否有完整的工作示例？

在http://www.trirand.com/jqgridwiki/doku.php?id=wiki:jquery_ui_methods上有关于构建jqGrid列选择器的说明（’dlog_opts是要传递给“dlog”的选项对象，或者（更多）很可能）一个创建选项对象的函数。默认为ui.dialog’）生成一个合适的选项对象，但不是完整的工作代码; 没有提供所需function的示例。

是否有一个完整的工作示例来构建一个允许隐藏，显示和移动列的jqGrid列选择器？

Answer 1

从答案中看一下旧例子 。 该示例主要是关于另一个主题，但在导航栏中您可以看到“列选择器”按钮。 单击按钮显示列选择器对话框。 您可以从对话框中拖动任何列名称并将其放在另一个位置以更改列顺序。 您可以单击“ – ”隐藏列并从隐藏列列表中拖动任何列，然后将其放在可见列列表中。

要重现该行为，首先应确保在jqGrid下载期间选择了“jQuery UI addons”（ grid.jqueryui.js ）。 然后你应该遵循以下步骤：

1. 从jqGrid 4.0源码的plugins子目录中包含ui.multiselect.css 。

2. 包括jQuery UI jquery-ui.min.js （不仅jquery-ui.css通常需要jqGrid）

3. 在jquery-ui.min.js之后包含jquery-ui.min.js

4. 添加调用列选择器的新按钮

代码可以如下所示

 var grid = $('#list'); grid.jqGrid ('navButtonAdd', '#pager', { caption: "", buttonicon: "ui-icon-calculator", title: "Choose Columns", onClickButton: function() { grid.jqGrid('columnChooser'); } }); 

更新： 答案包含基于我的建议的columnChooser的一些额外自定义的描述。