Multiple column sorting - Jqgrid

Question

I am trying to sort multiple columns on Jqgrid..But its not sorting at all. I am using below code.

multiSort : true, sortname: 'orderNo asc, cd', sortorder: 'desc',

How to do that? Is any other way to do that?

I also tried below one

 $('#OrderGrid').jqGrid('sortGrid', 'orderNo', true, 'asc')
 .jqGrid('sortGrid', 'cd', true, 'desc');

But no luck still now...

Solution

To set "desc" order one have to call sortGrid twice:

$('#OrderGrid').jqGrid('sortGrid', 'orderNo', true, 'asc')
    .jqGrid('sortGrid', 'cd', true, 'desc')
    .jqGrid('sortGrid', 'cd', true, 'desc');

For example if you need to set sort direction of both orderNo and cd columns to desc you should use

$('#OrderGrid').jqGrid('sortGrid', 'orderNo', true, 'desc')
    .jqGrid('sortGrid', 'orderNo', true, 'desc')
    .jqGrid('sortGrid', 'cd', true, 'desc')
    .jqGrid('sortGrid', 'cd', true, 'desc');

Be sure that you set multiSort option of jqGrid to true before calling of sortGrid:

$('#OrderGrid').jqGrid('setGridParam', {multiSort: true})
    .jqGrid('sortGrid', 'orderNo', true, 'asc')
    .jqGrid('sortGrid', 'cd', true, 'desc')
    .jqGrid('sortGrid', 'cd', true, 'desc');

Alternatively you can don't use sortGrid at all. The demo demonstrates the approach. It uses the following code

setSorting.call($grid[0], "name", "desc");
setSorting.call($grid[0], "invdate", "asc");
$grid.jqGrid("setGridParam", {
    multiSort: true,
    sortname: "name desc, invdate asc"
}).trigger("reloadGrid");

where setSorting function are defined as below

var setSorting = function (colName, sortOrder) {
    var $self = $(this),
        colModel = $self.jqGrid("getGridParam", "colModel"),
        headers = $self[0].grid.headers,
        showSortIconsInAllCols = $self.jqGrid("getGridParam", "viewsortcols")[0],
        cmLength = colModel.length,
        cm,
        $sortSpan,
        i;
    for (i = 0; i < cmLength; i++) {
        cm = colModel[i];
        if (cm.name === colName) {
            cm.lso = String(sortOrder).toLowerCase() === "desc" ? "desc" : "asc";
        }
        $sortSpan = $(headers[i].el).find(">div.ui-jqgrid-sortable>span.s-ico");
        if (showSortIconsInAllCols || cm.lso) {
            $sortSpan.show();
            if (cm.lso) {
                $sortSpan.find(">span.ui-icon-" + cm.lso)
                    .removeClass("ui-state-disabled");
            }
        }
    }
};