Ajax call halting on some browsers

Question

According to the console this Ajax call to post with Firefox on some PC's in a business environment doesn't happen (240 identical installations). If I remove the location.reload(); then the Ajax post happens just fine. However, the browser doesn't refresh defeating the point of having it use Ajax.

Have I done something wrong?

 select: function(start, end, allDay, jsEvent, view) {                  
                    if (userID) {                   
                        var start = moment(start).format('YYYY-MM-DD')
                        var end = start;                
                        $.ajax({
                            type: "POST",
                            cache: false,
                            url: 'http://intakecalendar/adddate.php',
                            data: 'userID='+ userID + '&start=' + end   //+ '&end=' + end <-- Providing the REAL end date makes it show on the wrong day
                        });                     
                    } //End if
                    location.reload();
            } // end select

May be its a cache issue. http://stackoverflow.com/questions/10719505/force-a-reload-of-page-in-chrome-using-javascript-no-cache — αƞjiβ, Mar 16 '15 at 15:50
You mention remove location.delay() - I see location.reload(), is that a typo? — Mike Weber, Mar 16 '15 at 15:50
`However, the browser doesn't refresh defeating the point of having it use Ajax.` The point of ajax is usually to not have to refresh the whole page. Your posted code suggests you'd have better to use a FORM instead to submit data to server. Although there is nothing wrong with using ajax here. Then just wondering, why do you have to reload the page? If it is to display new datas, then instead use relevant ajax callback — A. Wolff, Mar 16 '15 at 15:57
There's another bug on a calendar refresh call. So I'm just reloading the page right now. — Joe Swindell, Mar 16 '15 at 16:01
@JoeSwindell Then it sounds really like a XY problem, you aren't asking the relevant question :) http://mywiki.wooledge.org/XyProblem — A. Wolff, Mar 16 '15 at 16:02

score 6 · Accepted Answer · answered Mar 16 '15 at 15:50

It is a race condition. You are making an http call and reloading the page. Only one will win and modern day browsers, page navigation aborts open http requests.

Move the reload to the success/complete handlers.

select: function(start, end, allDay, jsEvent, view) {
  if (userID) {
    var start = moment(start).format('YYYY-MM-DD')
    var end = start;
    $.ajax({
      type: "POST",
      cache: false,
      url: 'http://intakecalendar/adddate.php',
      data: 'userID=' + userID + '&start=' + end, //+ '&end=' + end <-- Providing the REAL end date makes it show on the wrong day
      complete: function() {
        window.location.reload();
      }
    });
  } else {
    window.location.reload();
  }

}

Thanks for your help! This is exactly what was going on. – Joe Swindell Mar 16 '15 at 16:05 — Joe Swindell, Mar 16 '15 at 16:05

Ajax call halting on some browsers

1 Answers1