Install url on loadBeforeSend in jqGrid

Question

I have a wcf service for a lot of reports that return json data in jqgrid. Everything works as expected. However, due to the large number of user inputs for each report request, I decided to use the json string, which corresponds to the series of input models that I have installed on the server. I don’t want to mess with long complex query strings on my routes.

Question: How can I add jqGrid query string parameters so that my json string is loaded onto the server? I tried loadBeforeSend, but I cannot override the ajax url. I cannot use the function for the url parameter, because the grid parameters are not yet available. Any ideas? Thanks.

My jqGrid function (short for short):

function loadGrid() { var tbl = $('#tbl'); tbl.jqGrid({ loadBeforeSend: function () { var ai = { dateFrom: dbDateTime($('#at-datefrom').val()), dateTo: dbDateTime($('#at-dateto').val()), sidx: tbl.getGridParam('sortname'), sord: tbl.getGridParam('sortorder'), page: tbl.getGridParam('page'), rows: tbl.getGridParam('rowNum') }; var newUrl = getBaseURL() + 'ReportingService.svc/report/?json=' + JSON.stringify(ai); tbl.jqGrid().setGridParam({ url: newUrl });//Everything works perfect up to this point. All the values are in my json string and my url is correct. }, url: '', //Empty because I need to override it datatype: 'json', mtype: 'GET', ajaxGridOptions: { contentType: 'application/json' }, loadError: function (xhr, status, error) { alert(status + "" + error); } }).navGrid('#attendance-pager', { edit: false, add: false, del: false }); } 

Answer 1

If you use mtype: 'GET' and neew only to set additional parameters that will be added to the URL, you can use the postData parameter for jqGrid. You will get the best results if you define postData as a function (see here for more details).

Another way is to use beforeRequest , where this will be set to the DOM element of the grid, and you can access (and change if needed) the url parameter for jqGrid for this.p.url . You can, of course, use $(this).jqGrid('setGridParam','url',yourNewUrl); instead of directly modifying this.p.url .

I do not recommend using the datatype function in your case. By the way, you cannot use beforeRequest when using datatype as a function.

Answer 2

I hate answering my question, but this answer provided by Matthew works fine. The question is a bit ambiguous, but whatever.

In a nutshell, you need to call the external ajax function from the 'datatype' parameter. Since jqGrid is now loading (although without any data), you can grab parameter data from user input (i.e., Page 3 of the recordset, sort "desc", etc.) and add it to the json string.

This means that you really need a simple uri route. Hope this helps someone.