jqGrid - sort not working - jqgrid

Question

$("#grid").jqGrid({
datatype: 'local',
mtype: 'GET',
loadui: 'block',
altRows: true,
altclass: "myAltRow",
multiselect: false,
recordpos: "right",
pagerpos: "center",
pager: $('#gridt_summarypager'),
pginput: false,
rowNum: 100,
recordtext: "Showing {0} - {1} of {2}",
viewrecords: true,
sortname: 'Project',
sortorder: 'asc',
colNames: ['ProjectID', '<%: Project %>', '<%: ProjectTitle %>' , 'ProjectItemID', '<%: usProjectItem %>', 'Hours To Authorise', 'Hours Not Posted', 'Hours Rejected', 'Last 12 Months'],
colModel: [
{ name: 'ProjectID', index: 'ProjectID', width: 0, hidden: true},
{ name: 'Project', index: 'Project', width: 90, align: 'left', formatter: htmlEncodedString },
{ name: 'ProjectTitle', index: 'ProjectTitle', width: 90, align: 'left', formatter: htmlEncodedString },
{ name: 'ProjectItemID', index: 'ProjectItemID', width: 0, hidden:true },
{ name: 'ProjectItem', index: 'ProjectItem', width: 100, align: 'left', formatter: htmlEncodedString },
{ name: 'HoursToAuthorise', index: 'HoursToAuthorise', width: 125, align: 'right', formatter: timesheetsProjectToAuthoriseQueryFormat },
{ name: 'HoursNotPosted', index: 'HoursNotPosted', width: 125, align: 'right', formatter: timesheetsProjectUnpostedQueryFormat<% if (!(bool)ViewData["PostingEnabled"]) { %>, hidden: true <% } %> },
{ name: 'HoursRejected', index: 'HoursRejected', width: 125, align: 'right', formatter: timesheetsProjectRejectedQueryFormat },
{ name: 'HoursSubmitted12Months', index: 'HoursSubmitted12Months', width: 125, align: 'right', formatter: timesheetsProjectYearQueryFormat }],
imgpath: '../../Scripts/css/ui-lightness/images',
height: 145,
shrinkToFit: false,
hoverrows: false,
loadError: function (xhr, st, err) {
if (xhr.status == 200) {
window.location = '<%= loginPage %>';
}
else if (xhr.status == 500) {
$('#grid_summary_errors').html(xhr.statusText);
}
},
beforeSelectRow: function(rowid, e) {
/* disable row selection */
return false;
},
onSortCol: function (index, columnIndex, sortOrder) {
var col = $("#grid_summarygrid").getGridParam('colNames');
var label = "Ordered by " + col[columnIndex] + " " + sortOrder + "ending";
$("#gridsort").text(label);
}
});
$("#grid").setGridParam({ url: '<%= Url.Action(dataMethod, controllerName)%>?qid=xxx', page: 1, datatype: "json" })
.trigger('reloadGrid');
Currently using jqGrid 4.4.1 and it loads data fine but once sort is applied it updates the sort label buy grid data is not sorted. What is going on? Any help most appreciated...

Answer 1

If you set url and change datatype of grid to "json" then your server code is responsible for sorting of data like for paging too. If you want to load all data for the grid at once and want that jqGrid do sorting and paging for you then you should use loadonce: true option.
I recommend you additionally to include gridview: true option in jqGrid, replace pager: $('#gridt_summarypager') to pager: '#gridt_summarypager', remove not existing parameter imgpath and consider to use autoencode: true option of jqGrid which makes HTML encoding of strings in all columns which not contains custom formatter.

Answer 2

{
name: "name",
index:"name",
**sortable: true,**
editable: true,
**sorttype: 'text',**
key: true
},
Make sure that sorttype complies with the fields data type. for example if the grid field "name" contains int numbers, then you should have sorttype: 'int'.
Also as mentioned by Oleg, you need to set loadonce to true.
pager: "#pager",
gridview: true,
rowNum: 5,
loadonce:true,
multiSort: true,
rownumbers: true,
viewrecords: true,
rowList: [5, 10, 15],

Answer 3

include sortable: true in column as well as jqgrid property.

Answer 4

Chaning this parameter value worked for me.
loadonce: true