If ajax isn't successful after an interval how do I cancel it and perform an operation?

Question

I have a jQuery ajax call that looks something like this:

jQuery( document ).on( 'mouseover', '#wp-admin-bar-noti-bar-new', function() {

  jQuery.ajax({
    url: "domain.com",
    // etc
    success:function(data){

        // change element id
        jQuery('#wp-admin-bar-noti-bar-new').attr('id','wp-admin-bar-noti-bar');
    }
  });
});

So if ajax call is successful, it changes element. My question is, how do I make it so that if call is unsuccessful after 10 seconds, it should cancel it and do something (like show alert).

How can I do this?

This question and answers will help you out -> [Abort Ajax requests using jQuery](http://stackoverflow.com/q/446594/1407478) - `.abort()`... — davidkonrad, Feb 28 '15 at 16:09

score 4 · Accepted Answer · edited May 23 '17 at 12:08

4

You can set a timeout on the AJAX call and handle that error situation.

jQuery.ajax({
    url: 'domain.com',
    timeout: 10000, // ten seconds in milliseconds
    .
    .
    .
    error: function(request, status, err) {
        if (status === "timeout") {
            alert("Timeout");
        }
    }
});

Note, I used this answer, in part, to formulate my answer.

Once AJAX requests are sent, they are sent. You can't really do too much about them on the server side (see this answer).

You can, however, cancel them on the client side. The request parameter is an jqXHR object which allows you to abort the call using request.abort(); so your function will look something like this:

error: function(request, status, err) {
    if (status === "timeout") {
        request.abort();
        alert("Timeout");
    }
}

edited May 23 '17 at 12:08

Community

1
1

answered Feb 28 '15 at 16:12

Sumner Evans

8,951
5
30
47

1

But will this **abort** the initial ajax call? – Henrik Petterson Feb 28 '15 at 16:14
@Musa no, I forgot to add the function parameters. – Sumner Evans Feb 28 '15 at 16:15
As far as I can read this code, it does handle timeout, but does it cancel the initial call? – Henrik Petterson Feb 28 '15 at 16:17
1

@HenrikPetterson, you really cant "abort" an ajax-request. When it is fired to the server you have no longer control of the process. But you can abort the bindings on the javascript layer. – davidkonrad Feb 28 '15 at 16:20
Thank you, that is an outstanding explanation. The only problem is that I just ran your code and it does not work, see my full code here: http://pastebin.com/g7nJnPZn Did I place your code correctly? I suspect there is an error somewhere? – Henrik Petterson Feb 28 '15 at 16:30
Sorry I did not explain this properly. Nothing is working when implementing your solution. No errors are shown but the initial ajax is never called. – Henrik Petterson Feb 28 '15 at 16:37
@HenrikPetterson You need a comma after the end of your success function. – Sumner Evans Feb 28 '15 at 17:05
Dude. Outstanding. Thank you **very** much! – Henrik Petterson Feb 28 '15 at 17:11
@HenrikPetterson Glad to be of service. – Sumner Evans Feb 28 '15 at 17:14
Just changing 100000 to 10000 so it's 10 seconds ;) – Henrik Petterson Feb 28 '15 at 17:14
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/71962/discussion-between-jsve-and-henrik-petterson). – Sumner Evans Feb 28 '15 at 20:44

If ajax isn't successful after an interval how do I cancel it and perform an operation?

1 Answers1