Set Url on loadBeforeSend in jqGrid

Question

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

score 2 · Accepted Answer · edited May 23 '17 at 12:22

2

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.

edited May 23 '17 at 12:22

Community

1
1

answered Jun 10 '11 at 08:12

Oleg

220,925
34
403
798

Any reason why you don't recommend using a datatype function? It's been working well for me so far. Thanks Oleg. – trevorc Jun 14 '11 at 20:52
@nameEqualsPNamePrubeGoldberg: The answer on your question could be long. There are many disadvantages of the way. The main reason is that there are more direct way which you not use. You question is like a question why should you use the key to the door and not use the window instead. The answer is: because you have the key to the door and it is the way in the house through the door is the way by design. It is the most direct and simple way. You entered in the house through the window before and it worked. OK, but the way through the window should be used only in extreme and not ordinal case. – Oleg Jun 14 '11 at 21:01
@nameEqualsPNamePrubeGoldberg: jqGrid is designed to read XML data and almost any kind of JSON data. If you has some other type of data you should use datatype as function. – Oleg Jun 14 '11 at 21:05

score 0 · Answer 2 · edited May 23 '17 at 11:44

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.

Set Url on loadBeforeSend in jqGrid

2 Answers2

Linked