The groupig also works with remoute data. If the option groupDataSorted is turned on then to the sidx parameter is
added the grouping column name. This way the server know that it should first sort by the grouping column and then
to the sort column.
HTML
...
Java Scrpt code
jQuery("#48remote").jqGrid({
url:'server.php?q=2',
datatype: "json",
colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
colModel:[
{name:'id',index:'id', width:55, editable:true, sorttype:'int',summaryType:'count', summaryTpl : '({0}) total'},
{name:'invdate',index:'invdate', width:90, sorttype:'date', formatter:'date', datefmt:'d/m/Y'},
{name:'name',index:'name', width:100},
{name:'amount',index:'amount', width:80, align:"right", sorttype:'number',formatter:'number'},
{name:'tax',index:'tax', width:80, align:"right",sorttype:'number',formatter:'number'},
{name:'total',index:'total', width:80,align:"right",sorttype:'number',formatter:'number', summaryType:'sum'},
{name:'note',index:'note', width:150, sortable:false,editable:true}
],
rowNum:10,
rowList:[10,20,30],
height: 'auto',
pager: '#p48remote',
sortname: 'invdate',
viewrecords: true,
sortorder: "desc",
caption:"Grouping with remote data",
grouping: true,
groupingView : {
groupField : ['name'],
groupColumnShow : [true],
groupText : ['{0}'],
groupCollapse : false,
groupOrder: ['asc'],
groupSummary : [true],
groupDataSorted : true
}
});
jQuery("#48remote").jqGrid('navGrid','#p48remote',{add:false,edit:false,del:false});