How to stop the url sending(setGridParam) request in Jqgrid?

Question

I have created external three checkbox.

First I check the Male check box, sending the request to backend,response taking time 30 to 50 Sec.But suddenly I press Female checkbox, not send the female value parameter to backend.

SO I want to stop sending the request. Send new request with new parameters.

The Previous request finished after send the new request.

When I check ‘All’, it takes 2-3 minutes to fetch the response. Until the response is got, no other parameter can be set/sent. For example: If I check ‘All’, I can’t send the parameter for uncheck/check ‘Male’ or ‘Female’ until I get the response for ‘All’. I use setGridParam and get the data in JSON format.

it takes 2-3 minutes to fetch

$("#sex,#age).change(function() {

var sexVal=$("#sex").val();
//sexVal values are Male, Female and All

var listURL='localset.php?mode=yes&sex='+sexVal;
$("#list451").jqGrid("clearGridData", true);
jQuery("#list451").jqGrid('setGridParam',{url : listURL,mtype:'POST',datatype:'json'}).trigger("reloadGrid");

});


jQuery("#list451").jqGrid({
    url: 'localset.php?mode=yes',
    datatype: "json",
    height: 255,
    width: 600,
    colNames: ['Index', 'Name', 'Code', 'N Name', 'C Name'],
    colModel: [{
            name: 'item_id',
            index: 'item_id',
            width: 65,
            sorttype: 'integer',
            searchoptions: {
                sopt: ['eq', 'ne', 'le', 'lt', 'gt', 'ge']
            }
        }, {
            name: 'name',
            index: 'name',
            width: 150,
            sorttype: 'string',
            searchoptions: {
                sopt: [cn]
            }
        }, {
            name: 'code',
            index: 'code',
            width: 150,
            sorttype: 'string',
            searchoptions: {
                sopt: ['eq', 'bw', 'bn', 'cn', 'nc', 'ew', 'en']
            }
        }, {
            name: 'sex',
            index: 'sex',
            width: 150,
            sorttype: 'string',
            searchoptions: {
                sopt: [cn]
            }
        }, {
            name: 'c_name',
            index: 'c_name',
            width: 150,
            sorttype: 'string',
            searchoptions: {
                sopt: [cn]
            }
        },
        rowNum: 50,
        rowTotal: 200,
        rowList: [20, 30, 50],
        loadonce: true,
        mtype: "POST",
        rownumbers: true,
        rownumWidth: 40,
        gridview: true,
        pager: '#pager451',
        sortname: 'item_id',
        viewrecords: true,
        sortorder: "asc",
        caption: "External Check box Demo"
    }); jQuery("#list451").jqGrid('filterToolbar', {
    searchOperators: true
});

Sorry, but your question is not clear enough. What exact scenario you have (step by step)? What behavior you want to implement? If you want to send `sex` parameter to the server you can use `postData: { sex: function () { return $("#sex").val(); }}`. In the case every request to the server will contains the current value of the `"#sex"` control. You you want load grid only once you can use `loadonce: true`. You can disable `"#sex"` control any time by usage `$("#sex").prop("disabled", true)`. There are many scenarios, but it's unclear what you want to implement. — Oleg, Apr 14 '15 at 09:15
When I check ‘All’, it takes 2-3 minutes to fetch the response. Until the response is got, no other parameter can be set/sent. For example: If I check ‘All’, I can’t send the parameter for uncheck/check ‘Male’ or ‘Female’ until I get the response for ‘All’. I use setGridParam and get the data in JSON format. it takes 2-3 minutes to fetch — Krishnakumar Subbaiyan, Apr 14 '15 at 09:32
I have more options externally like check box, drop down, text box. Its complex to change the code and render the JSON format code.Thats why i use the setGridParam. — Krishnakumar Subbaiyan, Apr 14 '15 at 09:36
If the loading from the server is slow and you have not so much total rows of data than you can just load the data for `sex="all"` and filter the data **locally** without changing `datatype` to `'json'`. — Oleg, Apr 14 '15 at 09:43
The user can change the ‘options’ only when the response for the previous request is fetched. So, if the user wants just ‘male’ related records, the user has to wait till ‘all’ related records are fetched. Is there any way by which I can stop ‘All’ (which is taking time) request and make ‘male’ request immediately? — Krishnakumar Subbaiyan, Apr 14 '15 at 10:14
when user selects female check box then it sent to Server , before the Response received from the Back end user selects the male check box. So i want to cancel the Previous Request for fetching the female records and Need to sent the New request to the Server. Expected scenario is to process the Latest request from the User.It should not wait for Pending previous Request(Response not received) — Krishnakumar Subbaiyan, Apr 14 '15 at 10:29

score 1 · Accepted Answer · answered Apr 14 '15 at 10:30

If I understand correctly your question you want to cancel previous Ajax request. You should do two things for it:

disable the overlay created at the beginning of the Ajax request
execute abort method of the pending Ajax request.

To remove overlay and to reset $("#list451")[0].grid.hDiv.loading used by jqGrid for internal purpose you can just call $("#list451")[0].endReq().

You can use loadBeforeSend callback for example to cache jqXHR of the last Ajax request. You need just save the first parameter of the callback in a variable defied in the outer scope. You can call abort() method to abort the previous request.

How to stop the url sending(setGridParam) request in Jqgrid?

1 Answers1