0

Olá, eu tenho o seguinte problema: Eu carrego minha página inicial, e nessa página é trazido um select no bd muito pesado, por isso eu fiz com que a página carregasse, e em seguida, fizesse uma requisição AJAX para trazer e exibir essa tabela posteriormente, para que o usuário não precise ficar esperando esse select pesado ser realizado para acessar a página inicial.

Porém, como a requisição AJAX fica em andamento, eu não consigo acessar o menu e redirecionar para outra página enquanto o AJAX não termina, ou seja, eu clico em um link para mudar de página e o redirect só é feito depois que o AJAX retorna erro ou sucesso.

Eu preciso de uma maneira para abortar o AJAX e redirecionar para outra página instantaneamente, eu tentei utilizar a função .abort() e essa função aborta o carregamento da tabela na tela mas ela aguarda a requisição terminar. Eu preciso matar essa requisição para acessar os itens do menu rapidamente, podem me ajudar? Segue abaixo o código realizado.

<script>
        var progress;
        carregaEstatisticas();

        function carregaEstatisticas() {
            $('#divEstatisticas').html('<table class="col-lg-12 col-md-12 col-sm-12"><tr><td align="center"><img class="img-responsive" src="/Content/img/loading_laranja.gif" style="width: 20px; height: 20px;"></td></tr></table>');
            getEstatisticas();
        }

        function getEstatisticas() {
            progress = $.ajax({
                url: '/Home/Estatisticas',
                type: "POST",
                data: {
                    dataConsulta: $('#dataConsulta').val(),
                    empresa: $('#empresa').val()
                },
                success: function (data) {
                    $("#divEstatisticas").html(data);
                }
            });
        }

        $('a').on("click", function () {
            progress.onreadystatechange = null;
            progress.abort();
            progress = false;
        });
    </script>

1 Resposta 1

1

Use event.preventDefault();

Você

    function getEstatisticas() {
        event.preventDefault();
        progress = $.ajax({
            url: '/Home/Estatisticas',
            type: "POST",
            data: {
                dataConsulta: $('#dataConsulta').val(),
                empresa: $('#empresa').val()
            },
            success: function (data) {
                $("#divEstatisticas").html(data);
            }
        });
    }

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .