jQuery Grid Plugin - jqGrid

Here is the text from

var billGrid;
var colModelNames = [ 'serviceName', 'CI_NAME', 'volumeName','CI_TYPE','UDDS', 'amount', 'billingCodeCmdb', 'ovrrdBillingCode', 'isSplitBilling', 'billingCodeType'];
var emptyMsgDiv = $('There are no unposted rows');
$(function(){
var targetPage = 1;
billGrid = $("#list").jqGrid({
url:"${createLink(controller:'storageBilling', action:'getSummaryBillData', params:[id:billing.id, postedStatus: 'canBePosted'])}",
datatype: 'json',
mtype: 'GET',
colNames:[ 'SEO Service billed', 'CI billed', 'Volume Name','CI Type','UDDS', 'Amount Billed','CMDB Billing code','Billing Code Override', 'Split', 'Billing Code Type', 'SourceBillable'],
colModel :[
{name:colModelNames[0],width:60, sortable:true, sorttype:'text'},
{name:colModelNames[1], width:50, editable:true, edittype:'text', formatter:formatCiName},
{name:colModelNames[2], width:70, sortable:true, sorttype:'text'},
{name:colModelNames[3], width:50, sortable:true, sorttype:'text'},
{name:colModelNames[4], width:30, sortable:true},
{name:colModelNames[5], width:30, sortable:true, align:'right', formatter:'currency', sorttype:'currency',
formatoptions:{decimalPlaces:0,prefix:'$'},summaryType:'sum'},
{name:colModelNames[6], width:50, editable:true, sortable:true},
{name:colModelNames[7], width:50, editable:true, sortable:true},
{name:colModelNames[8], width:50},
{name:colModelNames[9],hidden:true},
{name:'sourceBillable', hidden:true}
],
width: '1000',
toppager:true,
height: '100%',
pager: '#pager',
rowNum:1000,
rowList:[10,20,50,100,1000],
viewrecords: true,
gridview: true,
jsonReader:{repeatitems: false},
loadonce: true,
footerrow : true,
grouping:true,
groupingView: {
groupField:['billingCodeType','billingCodeCmdb'],
groupOrder:['asc','asc'],
groupSummary:[true,true],
groupColumnShow:[false,false],
groupCollapse:false,
},
subGrid: true,
subGridRowExpanded: function(subgrid_id, row_id) {
var subgrid_table_id;
subgrid_table_id = subgrid_id+"_t";
jQuery("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' class='scroll'></table>");
jQuery("#"+subgrid_table_id).jqGrid({
url:'${createLink(controller:'billableServiceItem', action:'getDetails')}&id=' + row_id,
datatype: "json",
colNames: ['CI Validation Notes','Billing Code Validation Notes','Base CI Data'],
colModel: [
{name:"valnotes",index:"valnotes",width:200, cellattr:detailsFormatter},
{name:"billval",index:"billval",width:200, cellattr:detailsFormatter},
{name:"cidetails",index:"cidetails",width:400,formatter:ciDetailsFormatter},
],
height: '100%',
});
function ciDetailsFormatter(cellvalue, options, rowObject){
var ciObj = jQuery.parseJSON(cellvalue);
var ciObjStr = "";
for (var prop in ciObj){
if (ciObj.hasOwnProperty(prop)){
ciObjStr = ciObjStr + prop + ": " + ciObj[prop] + ", ";
}
}
return '' + ciObjStr + '';
};
function detailsFormatter(rowId, val, rawObject, cm){
return 'class="wrapTableCell"';
};
},
caption: 'Storage Items to be billed',
loadComplete: onLoadComplete,
}).navGrid('#list_toppager', {add:false, del:false, edit:false, refresh:false, search:false},{},{},{},{},{});