Cancelling the current ajax request via a button click event!

Question

I'd like cancel if my ajax request is taking long time with slower connections.

I show an overlay when .ajaxStart() and if takes longer than five secons (i managed with setInterval) a button appears on overlay that should cancel the current ajax request.

heres some of my code:

jqXHR = $.ajax({
    url: 'includes/inc_ajax.php',
    type: 'POST',
    data: '&ajax=1&action=7',
    success: function (txt) {
        var cntr = $.parseJSON(txt);
        $("#onlineppl").html(cntr.online);
        $("#todayppl").html(cntr.bugun);
        $("#totalppl").html(cntr.toplam);
    }
});

$("#abortAjax").button({ icons: {secondary: "ui-icon-cancel"} }).click(function() {
    $(jqXHR).abort();
});

Do I have to assign the $.ajax() function to a variable to abort it? I have many ajax request called by ajax too so i guess the browser can't track the same var name that causes the abort method not to work.

This is my first question here and I am a bit confused. Any help appreciated. Thanks.

Answer 1

Well, you culd try:

jqXHR.abort();

Whitout the $()

Note its not tested, i saw it somewhere

EDIT

Aah found it:

Stop all active ajax requests in jQuery