Set Url on loadBeforeSend in jqGrid

问题:

I have a wcf service for a large number of reports that returns json data to my jqgrid. Everything works as expected. However, due to the large number of user inputs for each report query I have elected to use a json string that matches a series 'input models' I have setup on the server. I don't want to mess with long complicated query strings in my routes.

Question: How can I add the jqGrid query string params do my json string I am uploading to the server? I have tried 'loadBeforeSend' but I can't seem to override the ajax url. I can't use a function for the url parameter because the grid params are not available yet. Any ideas? Thanks.

My jqGrid function (shortened for brevity):

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 });
    }

回答1:

If you use mtype: 'GET' and neew just to set additional parameters which will be appended to URL you can use postData parameter of jqGrid. The best results you will have if define the postData as a function (see here for details).

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

I don't recommend you to use datatype as function in your case. By the way you can't use beforeRequest in case of usage datatype as function.

回答2:

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

In a nutshell, you need to call an external ajax function from the 'datatype' parameter. Because jqGrid is now loaded (albeit without any data) you can capture the param data from user input (i.e. page 3 of the record set, sort 'desc', etc.) and add it to your json string.

This makes for a real easy uri route in your service. Hope this helps someone.