So, I think I fixed my own problems and, perhaps, expanded the functionality of jqGrid in the process? Nothing like rolling up your sleeves and digging in someone else’s code…
First, I added a “postData” property in jqGrid()’s extend() function that initializes with an empty object {}:
$.fn.jqGrid = function( p ) {
p = $.extend({
...
loadComplete: null, //Joe Tataro
postData: {},
editurl: null,
...
}, p || {});
Nextly, I added some function to manipulate that postData object and properties thereof. As it stands, the functions do not contain much error-checking. I do minimal checking on the setter only.
/*---- start postData-related functions ---*/
$.fn.getPostData = function(){
return this[0].p.postData;
};
$.fn.setPostData = function( newdata ) {
// check if newdata is correct type
if ( typeof(newdata) === 'object' ) {
this[0].p.postData = newdata;
}
else {
alert("Error: cannot add a non-object postData value. postData unchanged.");
}
};
$.fn.appendPostData = function( newdata ) {
// check if newdata is correct type
if ( typeof(newdata) === 'object' ) {
$.extend(postData, newdata);
}
else {
alert("Error: cannot append a non-object postData value. postData unchanged.");
}
};
$.fn.setPostDataItem = function( key, val ) {
this[0].p.postData[key] = val;
};
$.fn.getPostDataItem = function( key ) {
return this[0].p.postData[key];
};
$.fn.removePostDataItem = function( key ) {
delete this[0].p.postData[key];
};
/*---- end postData-related functions ---*/
Finishly, I modded populate() and subgridpopulate() to work with the postData variable. This involved creating two new datatypes: “json/post” and “xml/post”. I simply combine the params from the existing GET implementation with the data in postData.
var populate = function () {
if(!grid.hDiv.loading) {
grid.hDiv.loading = true;
$("div.loading",grid.hDiv).fadeIn("fast");
switch(ts.p.datatype)
{
case "json":
$.getJSON(ts.p.url,{page: ts.p.page, rows: ts.p.rowNum, sidx: ts.p.sortname, sord:ts.p.sortorder}, function(JSON) { addJSONData(JSON,ts.grid.bDiv); if(loadComplete) loadComplete();});
if( ts.p.loadonce ) ts.p.datatype = "local";
break;
case "xml":
$.ajax({ url: ts.p.url,type:"GET",dataType:"xml",data :{page: ts.p.page, rows: ts.p.rowNum, sidx: ts.p.sortname, sord:ts.p.sortorder}, complete:function(xml) { addXmlData(xml.responseXML,ts.grid.bDiv);if(loadComplete) loadComplete();}});
if( ts.p.loadonce ) ts.p.datatype = "local";
break;
/*---- start postData-related functions
*/
case "json/post":
$.post(ts.p.url, $.extend(ts.p.postData, {page:ts.p.page, rows:ts.p.rowNum, sidx:ts.p.sortname, sord:ts.p.sortorder}), function(JSON) { addJSONData(JSON,ts.grid.bDiv); if(loadComplete) loadComplete();}, "json");
if( ts.p.loadonce ) ts.p.datatype = "local";
break;
case "xml/post":
$.ajax({ url: ts.p.url,type:"POST",dataType:"xml",data:$.extend(ts.p.postData, {page:ts.p.page, rows:ts.p.rowNum, sidx:ts.p.sortname, sord:ts.p.sortorder}), complete:function(xml) { addXmlData(xml.responseXML,ts.grid.bDiv);if(loadComplete) loadComplete();}});
if( ts.p.loadonce ) ts.p.datatype = "local";
break;
/*---- end postData-related functions
*/
case "local":
sortArrayData();
break;
}
}
return false;
}
Example of usage is:
var ids = "";
$("input[name='locIDSet']:checked").each( function(i) { ids = ids + "," + this.value; } ); //collects all checked checkboxes with name locIDSet
jQuery("#list2").setPostDataItem( "ids", ids ); // adds to postData
jQuery("#list2").setPage(1);
jQuery("#list2").trigger('reloadGrid');
Is this correct? Should it have been done some other way?
.
