Reputation: 97
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...
Upvotes: 2
Views: 14422
Reputation: 221997
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");
}
}
}
};
Upvotes: 5