How to stop long running grid loading?

[zoltan-fedor]

Hi Oleg,

This is a question which might be an enhancement request if it turns out that currently this isn't possible with jqGrid.

Let me describe the scenario.
I have some grids showing some aggregated data which are driven from some selections made by the user. What is important that to load the data into the grid is very slow (>10s), because that aggregation is heavy on the database (tables with tens/hundreds of millions of rows). This cannot be made any faster on the database side.
The problem that while the query is loading (<10s), sometimes the user changes his mind and makes a new selections and would like to submit a new loading of the grid. The problem, that there is no "abort" method to stop a pending grid refresh, so the user has to wait for the first to finish before a new "reloadGrid" can be issued.

I met a challenge with other slow loading objects (most notably charts) and I usually solve this by creating a global JS variable (or class attribute) to store the AJAX request in it and so I can call an abort on that object to cancel the current request and so I can send a new one. See this method in the accepted answer of http://stackoverflow.com/questions/4342438/cancelling-previous-ajax-request-jquery
This way the user doesn't need to wait for the original request to finish, while he already knows that he doesn't need that, but the request gets cancelled and the new one sent right away.

The question is whether there already is such an "abort" method for jqGrid? If not, could one be added to it?

Thanks!

[OlegKi]

Thanks you very much for the suggestion! I think, it's good idea. I described in one from my old answers on the stackoverflow how one could implement canceling of pending Ajax request. One can use loadBeforeSend callback to save jqXHR of the Ajax Request in some outer variable or as new option of jqGrid. To cancel the pending Ajax request one would need to call abort method of saved jqXHR object and to call endReq to hide the "Loading..." div. I think that I could introduce new method of jqGrid which simplify the steps. I think that I'll implement such soon.

[zoltan-fedor]

Thank you Oleg for the quick response.
Yes, you are right, this could be potentially implemented manually via loadBeforeSend, but it would be nice to get a built-in method, so no manual implementation is required.

I imagine the option to abort could be useful for all who are having long running queries to load data into the the grid.

I'm looking forward seeing this as a standard method built into jqGrid!

Thanks!

[OlegKi]

I posted the changes which introduces new abortAjaxRequest method (it has no parameters). You can try it. I think it's what you need.

[zoltan-fedor]

Thanks for the quick action!

Unfortunately it doesn't seem to work. I have used my earlier example reloading a treegrid, except that I have added a call to the new abortAjaxRequest method before calling the reloadGrid, see test case: http://broadcast-this.com/treegrid-4.9.1-reload3.php

Try using the "Reload with different data" button, which would be loading a JSON which has a 5 second delay in it, so the button could be used again to cancel the original request and send out a new one.

The problem that when calling abortAjaxRequest I receive a JS error:
Cannot read property 'hDiv' of undefined at jquery.jqgrid.src.js:3711

I am making the call this way:
jQuery('#tree').jqGrid ('abortAjaxRequest');
jQuery('#tree').jqGrid('setGridParam',{url: "data-reload3.php"}); // this will be loading slow, it has a 5second sleep in it
jQuery('#tree').jqGrid('clearGridData');
jQuery('#tree').trigger("reloadGrid");

Likely the issue is caused by the fact that at this time there is no reload running. Could you please make this method check first whether there is a current reload running, so the abortAjaxRequest always works, whether or not there is something to abort.

Thanks

[OlegKi]

Thank you! I could not test the abortAjaxRequest method. I posted the fix. Please try once more with the new code.

[zoltan-fedor]

Thanks Oleg, it works perfect now!
You can test it at http://broadcast-this.com/treegrid-4.9.1-reload3.php
Just hit the button, which will start loading the new data (which takes 5 second) and before the new data would arrive hit the button again. If you monitor the AJAX requests you will see that the outstanding request gets cancelled and a new one gets kicked off - exactly what we "abort" means.

Thanks again for your quick fix!