Stop ajax request

Question

Stop ajax request

Navigation

#1 by (4 votes)
#2 by (0 votes)

4

I have a page where an event grid is loaded in ajax. I also have a menu of actions on this screen.

As soon as you access, the page loads (including the action menu), and the event grid, because it is heavier, loads separately.

What is happening is that while the event table does not load completely, I can not trigger an action.

Example: I enter the page and the event grid starts loading (I see in the console the pending request) When I click on any link, the request is made, but only completed after the event grid finishes loading. At this time, two pending requests are on the console only: the event grid, and the link I clicked.

Does anyone have a light on how to solve this problem?

All requests are asynchronous. I think about aborting the pending requests when clicking on an action, but how ??

jquery ajax

asked by anonymous 16.12.2014 / 20:47

2 answers

How to enable and disable automatic scrolling in a chat? Open a new Activity from within a Fragment

score 4 · Answer 1

When you use the $.ajax() method of jQuery it returns an object that you can save in a variable. So:

var ajax = $.ajax(...);

This object has its own methods and one of them is .abort() , so just use ajax.abort(); to cancel the request.

You can also solve the problem with the design of the code itself. In other words, to plan in the code to attend to this problem. But to help out there I need to see how you have the code now. So what is a solution that I suggested above and what you are already looking for: cancel the ajax request.

score 0 · Answer 2

You can do recursively, it only loads the next to the end of the current, so it is possible to enter a request in the middle and it aborts the rest, loading what you want without waiting for the entire grid to be loaded.

As I have the same problem the solution was as follows

var arrTabela;//contem um array de id's para a consulta de cada linha da grade
var tot = 4; //pegar o total de linhas da tabelas 

function teste(arrTabela) {
    if(arrTabela < 0) return;
    return $.ajax({
        url : 'minha url q retorna o total',
        data: {id : arrTabela[0]},
        dataType: 'json',
        success: function(data){
            //subistitui o valor desejado
            $("#tot-list"+id).html(data);
            //remove o item usado no array
            arrTabela.splice(1,1);
            tot--;
            //chama novamente a função
            teste();
        }
    });
};

It was not exactly this way, but the idea is this, sorry for the syntax errors that must have many, but I made this head here. Hope it helps!