I am working on my first implementation of a jqGrid. I am using the standard add/edit buttons that appear in the navGrid but am having problems identifying how process the s
There are a few ways I have seen to do this:
jQuery("#search_results").jqGrid({ url: host, datatype: "xml", mtype: "GET", // Handy to see the params passed. height: 200, width: 500, ... ... etc gridComplete: function() { var ids = jQuery("#search_results").getDataIDs(); if (ids.length Empty Result'); } else { $('#jqgrid_error').hide(); } }, loadError: function(xhr,st,err) { jQuery("#jqgrid_error").html("Type: "+ st +"; Response: "+ xhr.status + " "+xhr.statusText+''); } }).navGrid('#search_results_pager', {edit:true,add:false,del:false,search:true}, { afterComplete:processed, // processed is a function you define closeAfterEdit: true, reloadAfterSubmit:true } );
From the documentation:
afterComplete This event fires immediately after all actions and events are completed and the row is inserted or updated in the grid. afterComplete(serverResponse, postdata, formid) where
gridComplete
This fires after all the data is loaded into the grid and all other
processes are complete.
loadError xhr,st,err
A function to be called if the request fails. The function gets passed
three arguments: The XMLHttpRequest object (XHR), a string
describing the type of error (st) that occurred and an optional
exception object (err), if one occurred.
There is a handy/helpful PDF documents (a little dated): http://www.scribd.com/doc/17094846/jqGrid.
There appears to be a couple event parameters that I failed to completely read and comprehend...
API --> http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing#editgridrow
using the event parameters for afterSubmit and afterComplete allow me to process the server response and update the form.
--Dan
EDIT Here is an example of the code used...
.navGrid(
"#product-codes-footer",
{edit:true,add:true,del:false},
{
afterShowForm:afterShowEdit,
afterSubmit:processAddEdit,
beforeSubmit:validateData,
closeAfterAdd: true,
closeAfterEdit: true
},
{
afterShowForm:afterShowAdd,
afterSubmit:processAddEdit,
beforeSubmit:validateData,
closeAfterAdd: true,
closeAfterEdit: true
}
);
function afterShowEdit(formId) {
//do stuff after the form is rendered
}
function afterShowAdd(formId) {
//do stuff after the form is rendered
}
function processAddEdit(response, postdata) {
var success = true;
var message = ""
var json = eval('(' + response.responseText + ')');
if(json.errors) {
success = false;
for(i=0; i < json.errors.length; i++) {
message += json.errors[i] + '<br/>';
}
}
var new_id = "1";
return [success,message,new_id];
}
You could try this:
navGrid('#gridpager',{view:true},{},{closeOnEscape:true},{afterSubmit:processAddEdit});
$.jgrid.search={
odata : ['equal', 'not equal', 'less', 'less or equal','greater','greater or equal', 'begins with','does not begin with','is in','is not in','ends with','does not end with','like','does not contain'],
sopt:['eq','ne','cn','bw','ew']
}