On the demo website for jqGrid, the columnChooser module is displayed like this:
It allows you to both reorder the columns and select which columns are to be shown.
Unfortunately when I enter this section of code into my application(The code that is suppose to make this appear exactly as portrayed):
jQuery("#colch").jqGrid('navButtonAdd','#pcolch',
{ caption: "Columns",
title: "Reorder Columns",
onClickButton : function (){
jQuery("#colch").jqGrid('columnChooser');
}
// ...
It displays a column chooser; however, it only allows you to choose which columns to display and not the order the appear. One other noticeable difference is that the interface looks nothing like the above, it is simply a list of columns that you either select or de-select, by control click to select them one at a time or shift-click to select in bulk.
Here is a link to the demo site, to use as a reference. http://trirand.com/blog/jqgrid/jqgrid.html
The problem which you have is well-known. The Column Chooser feature is described here http://www.trirand.com/jqgridwiki/doku.php?id=wiki:jquery_ui_methods#column_chooser and it is an example of integration of jqGrid with other foreign components . There are exist a jQuery UI widget (Plug-in) Mulitselect (see http://plugins.jquery.com/project/Multiselect , http://quasipartikel.at/multiselect/ and http://github.com/michael/multiselect/ ) which consist mostly from two files:
ui.multiselect.css
ui.multiselect.js
If you carefully read http://www.trirand.com/jqgridwiki/doku.php?id=wiki:jquery_ui_methods#column_chooser you will find information about this external files.
So to be able to use the Column Chooser feature like you see on demo page you need do following (together to standard steps):
ui.multiselect.css
stylesheet jquery-ui.min.js
and not only a css (like jquery-ui-1.8.2.custom.css
) which need jqGrid ui.multiselect.js
If you download jqGrid from http://www.trirand.com/blog/?page_id=6 you have to select "Query UI addons". The files ui.multiselect.css
and ui.multiselect.js
you will find in the subdirectories src\\css
and src
of the downloaded ZIP file.
Optional additional localization files for the Mulitselect widget you can download from http://quasipartikel.at/multiselect/ or http://github.com/michael/multiselect/ .
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.