How to exit from this recursive polling from jQuery?

Question

I previously asked about a question using Ajax polling from a server every 3 seconds using the following jQuery Ajax request:

function getData() {
    $.ajax({
        url : 'http://example.com',
        type: 'GET',
        success : function(data) {
            // process data here
            setTimeout(getData, 3000);
        },
        dataType : 'json'
    });
}

It seems that another way of doing this is putting setTimeout outside $.ajax() block:

function getData() {
    setTimeout( function() {
    $.ajax({
        url : 'http://example.com',
        type: 'GET',
        success : function(data) {
            //process data here
        },
        dataType : 'json'
    }) }, 3000);
}

So is there any difference between these two methods? Do they have the same effect of continuous polling the server every 3 seconds?

Also, inside the success callback function, how do I terminate this infinite polling if certain condition is met, say, data.length>1000 then I want to terminate this loop and call another function? Should I do something like this:

function getData() {
        var tID = setTimeout( function() {
        $.ajax({
            url : 'http://example.com',
            type: 'GET',
            success : function(data) {
                //process data here
                if(data.length > 1000) { 
                   funcOutside();
                   clearTimeout(tID);
                }
            },
            dataType : 'json'
        }) }, 3000);
    }

Jon · Accepted Answer · 2013-01-31 22:04:47Z

9

The second option won't poll every 3 seconds; it will only poll just once.

To conditionally continue or stop polling you should use a variation of the first option: add a conditional around the setTimeout call.

function getData() {
    $.ajax({
        url : 'http://example.com',
        type: 'GET',
        success : function(data) {
            // depending on the data, either call setTimeout or simply don't
            if( /* data says continue polling */) {
                setTimeout(getData, 3000);
            }
        },
        dataType : 'json'
    });
}

answered Jan 31, 2013 at 22:04

Jon

439k85 gold badges756 silver badges820 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

tonga Over a year ago

Thanks Jon. I think you are right. The second version only polls once. I will use your method to do conditional stop on polling.

bfavaretto · Accepted Answer · 2013-02-01 00:58:30Z

3

So is there any difference between these two methods? Do they have the same effect of continuous polling the server every 3 seconds?

Yes, there is an important difference! The first version will queue a call to the function after the response arrives. So the interval between calls will be (roughly) 3000ms plus the time the request/response took.

The second version will make a request after 3 seconds, then stop. If you change setTimeout to setInterval, it would make a new request every 3 seconds, but there would be no guarantee the previous request will already have completed when a new one is made (if one request takes ~3000ms). So the first version is probably what you're looking for.

About terminating the loop: yes, just add a condition like the one you have in your code. But instead of clearing the timeout, just don't add a new one:

//process data here
if(data.length > 1000) { 
    funcOutside();
} else {
    setTimeout(getData, 3000);
}

Final note: technically, that's not recursion, because it's not getData calling itself, but the callback from setTimeout calling getData all the time.

edited Feb 1, 2013 at 0:58

answered Jan 31, 2013 at 22:05

bfavaretto

72k18 gold badges118 silver badges162 bronze badges

1 Comment

tonga Over a year ago

Thanks for your suggestion. The second version indeed only polls data once. I should use the first one with conditional statement like you pointed out.

Libu · Accepted Answer · 2014-08-22 19:44:04Z

(function loopsiloop(){
   setTimeout(function(){
   $.ajax({
       url: 'foo.htm',
       success: function( response ){
           // do something with the response

           loopsiloop(); // recurse
       },
       error: function(){
           // do some error handling.  you
           // should probably adjust the timeout
           // here.

           loopsiloop(); // recurse, if you'd like.
       }
   });
   }, 5000);
})();

This will do the work for you. I'm doing three things here:

Declaring a function loopsiloop that is immediately invoked (notice the parens at the end).
Declaring a timeout handler to fire after 5 seconds.
Polling the server inside the timeout, which upon either success/failure will call loopsiloop and continue the poll.

Collectives™ on Stack Overflow

How to exit from this recursive polling from jQuery?

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related