jqGrid: is there an event for when columns are reordered?

Question

I'm using the column reordering feature in jqGrid

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

Is there an event that fires after columns are re-ordered? If there is, I can't see it!

Thanks in advance

Answer 1

There is a call in grid.jqueryui.js (jqGrid v3.8.2) in update() to ts.p.sortable.update() as discussed on the jqGrid message board, so:

jQuery('#gridId').jqGrid({
    ...,
    sortable: { update: function(permutation) {
        alert('save permutation somewhere');
    },
    ...
});

However, please note that the array passed to your callback will be relative to the current column order. In other words, saving the array as is after moving multiple columns will not produce the desired results.

I had to do something like this:

var defaultColNames = [ 'Alpha', 'Beta', 'Gamma' ];
var defaultColModel = [
    { name: 'alpha', index: 'alpha' },
    { name: 'beta', index: 'beta' },
    { name: 'gamma', index: 'gamma' }
];

jQuery('#gridId').jqGrid({
    ...,
    colNames: defaultColNames,
    colModel: defaultColModel,
    sortable: { update: function(relativeColumnOrder) {
        var grid = jQuery('#gridId');

        var defaultColIndicies = [];
        for( var i=0; i<defaultColModel.length; i++ ) {
            defaultColIndicies.push(defaultColModel[i].name);
        }

        if( grid.getGridParam('treeGrid') ) {
            // tree grid mode adds 5 extra columns
            defaultColIndicies = defaultColIndicies.concat(['level','parent','isLeaf','expanded','loaded']);
        }

        var columnOrder = [];
        var currentColModel = grid.getGridParam('colModel');
        for( var j=0; j<relativeColumnOrder.length; j++ ) {
            columnOrder.push(defaultColIndicies.indexOf(currentColModel[j].name));
        }

        // columnOrder now contains exactly what's necessary to pass to to remapColumns
        // now save columnOrder somewhere
        globalColumnOrder = columnOrder;
    },
    ...
});

// grab saved column order from cookie or something
var globalColumnOrder = [0,1,2];

// append to array if tree grid enabled
if( jQuery('#gridId').getGridParam('treeGrid') ) {
    // tree grid mode adds 5 extra columns
    for( var k=defaultColNames.length; k<(defaultColNames.length+5); k++ ) {
        globalColumnOrder.push(k);
    }
}

// restore column order
jQuery('#gridId').jqGrid('remapColumns', globalColumnOrder, true, false);

Answer 2

Found after reading Mr W's reply and experimenting a bit, there's a better way of doing things:

$("#gbox_" + gridid).bind("sortstop", function(){
    // you can even get the current permutation!
    // Yes, it looks like you may be grabbing the remapColumns function.
    //    You're not, you get an array of integers back.
    grid.jqGrid("getGridParam", "remapColumns");
})

Enjoy!