1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Stop an loading Ajax Spinner after unknown amount of ajax requests.

Discussion in 'jQuery' started by Carlos Moreira, Apr 24, 2015.

  1. #1
    Hello,

    I have a service that I am calling an unknown amount of times per each page requests. When the page loads I have a loading spinner running.

    Before, when I had one ajax requests, I would just stop the loading spinner at the end of that request, usually in the ".done()". Yet this time, I do not know how many calls will happen. I have something like this,

    for(var i = 0; i < requests_times ; i++){
    $.ajax({
    url : 'ServiceRequestUrl'
    }).done()
    .error()
    }

    Now, how would i be able to tell, that when the last ajax request is done, to hide the loading spinner. I have all the requests running asynchronously because they each are populating an area in the website.

    I know I can use promises, but I can only use it if I know the exact requests being made, for example :

    $.when( $.ajax('url1'), $.ajax('url2') ).then(function(){ //do something })

    If I would be able to pass an array to then $.when object then I believe I would be ok, but after reading the docs I do not believe I could.

    If someone could please help, I would greatly appreciate it.
     
    Solved! View solution.
    Carlos Moreira, Apr 24, 2015 IP
  2. PoPSiCLe

    PoPSiCLe Illustrious Member

    Messages:
    4,623
    Likes Received:
    725
    Best Answers:
    152
    Trophy Points:
    470
    #2
    Have the final request return a token, use that to check if it's the last request, if it is, hide the spinner
     
    PoPSiCLe, Apr 24, 2015 IP
  3. Carlos Moreira

    Carlos Moreira Peon

    Messages:
    4
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    1
    #3
    What happens if I don't know which one will finish last though? The service calls I am using are very slow and I don't control them.

    If I have 3 calls, the first one might be the only one with data in it, and it might take a while for it to finish, while the last 2 return no do and complete very quickly.

    Amazing response time as well, Thank you!
     
    Carlos Moreira, Apr 24, 2015 IP
  4. PoPSiCLe

    PoPSiCLe Illustrious Member

    Messages:
    4,623
    Likes Received:
    725
    Best Answers:
    152
    Trophy Points:
    470
    #4
    But you do know the amount of request_times within the loop, I assume - or else the loop will never end.
    So what you could do is you do a comparison of i == (request_times parseInt(-1)) and when it matches, end the spinner?
     
    PoPSiCLe, Apr 25, 2015 IP
  5. #5
    Create an array where you'll push all the ajax requests into.
    That way you'll be able to call your 'All done' code within $.when.apply().done();

    var requestarray=[];
    for (var i=0; i<requests_times; i++) {
    var request = $.ajax({ /* your call settings */ })
    requestarray.push(request);
    }
    $.when.apply(null, requestarray).done(function(){ alert('All done'); })
     
    Wasi88, Apr 25, 2015 IP
  6. Carlos Moreira

    Carlos Moreira Peon

    Messages:
    4
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    1
    #6
    Perfect, I will try this.

    Thank you.
     
    Carlos Moreira, Apr 25, 2015 IP
  7. Carlos Moreira

    Carlos Moreira Peon

    Messages:
    4
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    1
    #7

    This solved my Issue! Thank you!
     
    Carlos Moreira, Apr 28, 2015 IP
    Wasi88 likes this.
  8. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,998
    Best Answers:
    253
    Trophy Points:
    515
    #8
    The array thing seems needlessly complex -- I'd just have a counter. When you make a request, increment the counter and make sure the spinner is showing. When the request finishes decrement the counter and if it hits zero, remove the spinner.

    WAY simpler.
     
    deathshadow, May 20, 2015 IP