jqgridfree-jqgrid

Automatically canceling reuest jqGrid on version 4.3.1


I have checked below link, But solution given only support after version 4.3.2 Currently i am using the version 4.3.1 and it doesn't support the trigger handler. is there any other way i can solve this issue in version 4.3.1. Because Currently i can't upgrade to newer version. Changing the jqgrid core js file also fine.

I need to solve the below problem, the same question asked already which is i given in the link also

if the user makes another filter selection before the response comes back, the grid does not cancel the existing request, nor does it submit a new one, so at some point after the user makes the second selection, the grid updates to show the response for the first selection. Furthermore, the grid auto-updates when you change the filter selection, so to get it to show the data you wanted, you have to change your selection to something else, wait for that to load, and then change it back.

Automatically canceling jqGrid request


Solution

  • To be able to cancel underlying Ajax request, which will be sent by jqGrid, one needs to have access to jqXHR object, which is a superset of the XMLHTTPRequest object. The object has abort() method, which can be used to cancel pending Ajax request.

    9 yeas ago I posted the answer, where I described how one can get access to jqXHR object even in very old version of jqGrid. If you work with jqGrid 4.3.1 then you can do the following:

    1) add following callbacks to your code or to modify existing callbacks loadBeforeSend, beforeProcessing and loadError to initialize or to clear new jqXhr parameter:

    loadBeforeSend: function (jqXhr) {
        this.p.jqXhr = jqXhr;
        return true;
    },
    beforeProcessing: function () {
        this.p.jqXhr = null;
        return true;
    },
    loadError: function () {
        this.p.jqXhr = null;
    }
    

    2) add new method abortAjaxRequest to jqGrid using the following code

    $.jgrid.extend({
        abortAjaxRequest: function () {
            return this.each(function () {
                if (this.p.jqXhr != null) {
                    this.p.jqXhr.abort();
                }
                this.grid.endReq.call(this);
            });
        }
    });
    

    After that you can use code like $("#list").jqGrid("abortAjaxRequest"); to cancel pending Ajax requests. If you need to test, whether a pending Ajax request exist, you can test whether $("#list").jqGrid("getGridParam", "jqXhr"); is not null.

    UPDATED: The method endReq isn't saved in this.grid. The correct code of abortAjaxRequest could be the following:

    $.jgrid.extend({
        abortAjaxRequest: function () {
            return this.each(function () {
                if (this.p.jqXhr != null) {
                    this.p.jqXhr.abort();
                }
                this.grid.hDiv.loading = false;
                $("#lui_" + $.jgrid.jqID(this.p.id)).hide();
                $("#load_" + $.jgrid.jqID(this.p.id)).hide();
            });
        }
    });