JQGrid with Column Reordering

Question

I have a jqgrid and I can reorder my columns with this option in my JQGrid

    jQuery("#list").jqGrid({
                sortable: true,
                ... 
});

This functionality let me reorder ALL my columns. But I want that some columns must be on fixed places. Is there a way to solve this?

Thanks in advance!

Bruno

Answer 1

Never say never. jqGrid uses jQueryUI's Sortable class to perform the column drag-n-drop function. http://jqueryui.com/demos/sortable/

To remove a column from the list of sortable columns, run these two commands after you've rendered your grid (with sortable: true).

// disable the sortable property on your target element 
// (which was applied when jqGrid rendered the grid)
$('tr.ui-jqgrid-labels').sortable({ cancel: 'th:#element_id'});
// update the list of sortable item's, and exclude your target element
$('tr.ui-jqgrid-labels').sortable({ items: "th:not(#element_id)" });

Note: This works best if your unsortable columns are on the left or right edge of the grid. Otherwise, you will still be able to re-sort other columns around them.

Also: Make sure you understand the difference between the two sortable options (grid level and colmodel level). On the grid options, "sortable: true" means the columns can be reorders by drag-and-drop. On the colmodel options, "sortable: true" means that you can reorder the rows by clicking on the column's header. Setting sortable to true on the grid options will not cascade down to the colmodel options. However, on the colmodel sortable is true by default.