Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JQuery Ajax error when leaving page

I am using the following code to asynchronously pull data from the server into the client. The alert in the error block reports errors that occur on the server. However if the user navigates away from the page page mid-call, this block also gets fired and throws an empty alert container. Is there any way to handle the the user leaving the page more gracefully (i.e. not throw an empty alert before they leave)? Maybe by differentiating in the error block that the user has navigated away, rather than an error occurring on the server?

$.ajax({
    type: "GET",
    url: "/handlers/myHandler.ashx",
    async: true,
    dataType: "json",
    data: "var1=test_val&var2=test_val"
    success: function (invoices) {
       //Success block
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
        alert(errorThrown);
    }
});
like image 748
QFDev Avatar asked Mar 10 '13 19:03

QFDev


2 Answers

Try...

if (xhr.status != 0)
  alert(thrownError);

...where xhr is your XMLHttpRequest variable

like image 147
Michael Avatar answered Oct 11 '22 18:10

Michael


Problem solved..

I've set a global variable:

var unloadingState = false;

Then a beforeunload event handle (thanks Dave!), to modify the variable:

$(window).bind("beforeunload", function () {
    unloadingState = true;
});

And finally a cross-reference in the error block of the ajax method:

error: function (XMLHttpRequest, textStatus, errorThrown) {
  if (!unloadingState) {
    alert(errorThrown);
  }
}

And yes alerts are ugly and shouldn't be used!

like image 36
QFDev Avatar answered Oct 11 '22 17:10

QFDev