CODEWITHSUNDEEP
javascriptjquerydelaysettimeout
Joseph Astrahan
Joseph Astrahan

Reputation: 9072

Delay Execution Of Script Jquery (or SetTimeOut) BUT when out of scope

I've read some answers on this problem, but I'm not sure what to do in my case.

I have a function where the idea is it will keep attempting to connect via AJAX, and if it fails it will keep trying again every 5 seconds to submit information. This is important for a web app I'm developing where the users are offline 50% of the time and online 50% of the time.

The issue is in my current setup, I want to call setTimeOut to delay the execution of the function, but I think because I'm inside another function it has no idea about the location of startAjaxSubmitLoop() function? But when I run my code and check in console, I see millions of connections to my server one after another without a delay. It's as if the setTimeout() function delay properties was not working at all but it was still running the function?

Any ideas what I'm doing wrong?

function startAjaxSubmitLoop(id,tech_id){
                    //TODO: Make POST instead of GET because of pictures.
                    var request = $.ajax({
                      url: "script.php",
                      type: "GET",
                      data: { }
                    });

                    //If Successfully Sent & Got Response.
                    request.done(function( msg ) {
                        //Sometimes because of weak connections response may send, but the message it worked might not come back.
                        //Keep sending until for sure SUCCESS message from server comes back.
                        //TODO: Make sure server edits existing entries incase of double sends.  This is good in case they decide to edit anyways.
                      $( "#log" ).html( msg );
                    });

                    //If Failed...
                    request.fail(function( jqXHR, textStatus ) {
                        //Color the window the errorColor
                        //alert( "Request failed: " + textStatus );
                        setTimeout(startAjaxSubmitLoop(id,tech_id),5000);
                        console.log('test');
                    });
                }

Upvotes: 0

Views: 309

Answers (2)

ps2goat
ps2goat

Reputation: 8475

two ways to do this:

1) with a callback function: setTimeout( function(){startAjaxSubmitLoop(id,tech_id);},5000);

2) with parameters listed after the function name (no parentheses) and timeout period: setTimeout(startAjaxSubmitLoop,5000, id, tech_id);

Upvotes: 1

megawac
megawac

Reputation: 11353

You're calling setTimeout incorrectly. You're calling your startAjaxSubmitLoop immediately on the setTimout line and passing the result to setTimeout instead of your function. Modern setTimeout implementations (es5) let you pass args to setTimeout as below:

Instead of:

setTimeout(startAjaxSubmitLoop(id,tech_id),5000);

Use:

setTimeout(startAjaxSubmitLoop, 5000, id, tech_id); //call startAjaxSubmitLoop in 5000ms with id and tech_id

The standard way of doing this to support older browsers where setTimeout doesnt take params is to just wrap your function startAjaxSubmitLoop 

setTimeout(function(){startAjaxSubmitLoop(id, tech_id)}, 5000); //equivalent to above

Upvotes: 1

Related Questions