jqueryajaxcustom-exceptions

Wrap jQuery's $.ajax() method to define global error handling


Branching off of questions like this one, I'm looking to wrap jQuery's $.ajax() method such that I can provide error handling in one location, which would then be used automatically by all of an application's remote calls.

The simple approach would be to simply create a new name, similar to how $.get() and $.post() implement facades to $.ajax(). However, I'm hoping to reuse the name $.ajax(), such that we can keep the rest of our code using the standard jQuery syntax, hiding from it the fact that we've added our own error handling. Is this practical and/or good to achieve, or possibly a horrible idea?

EDIT: The responses so far indicate .ajaxError() is the way to go. I know this will catch 400 and 500 level errors, but is there a way (with this event handler or otherwise) to catch 302 redirects as well? I'm trying to handle responses that are redirecting to a login page, but we want to intercept that redirect when it's an XHR request, allowing the user to cancel the action instead of forcing them forwards automatically.


Solution

  • You might want to look at $.ajaxError.

    $(document).ajaxError(function myErrorHandler(event, xhr, ajaxOptions, thrownError) {
      alert("There was an ajax error!");
    });
    

    jQuery provides a whole bunch of other ways to attach global handlers.

    To answer your edit, you can catch successful ajax requests with $.ajaxSuccess, and you can catch all (successful and failed) with $.ajaxComplete. You can obtain the response code from the xhr parameter, like

    $(document).ajaxComplete(function myErrorHandler(event, xhr, ajaxOptions, thrownError) {
      alert("Ajax request completed with response code " + xhr.status);
    });