Question

Okay, I do use firebug to determine when a function is not defined in Dev. What I would like to do in production is show a modal window saying an error has been received which would then redirect them to another page upon click. Not so easy.

Please understand that this function does work and the component that is called works. I am going to misspell the function call on purpose to demonstrate the error I am not receiving thru the jquery ajax function.

I am using .ajaxSetup to set up the default options for several ajax functions that will be running asynch:

$.ajaxSetup({
    type: "POST",
    dataType: "json",
    url: "DMF.cfc",
    data: {
    qID: 1,
    returnFormat: "json"
    },
    beforeSend: function() {
        $('#loadingmessage').fadeIn();  // show the loading message.
    },
    complete: function() {
        $('#loadingmessage').fadeOut();  // show the loading message.
    }
    });  //end AjaxSetup

The actual ajax call is:

$.ajax({
        data: {
            method: 'getCurrentIssues'
        },
        success: function(response) {
            nsNewDebtshowDebtIssues(response);
        },//end success function
        error: function(jqXHR, exception) {
            alert("Error running nsNewDebt.showDebtIssues");
        }
    })  //end getCurrentIssues Ajax Call

The error I forced is that the method run in the success function should actually be nsNewDebt.showDebtIssues. Firebug correctly displays in console the error nsNewDebtshowDebtIssues is not defined but the actual error message for the ajax call does not run, so if an enduser was running the page it would appear the page was hung.

So, In summary I want to know how to track when such an error occurs, preferrable to place in the error section of the .ajaxSsetup but if neccessary in each .ajax call.

Answer 1

Well, the error actually occurs after the AJAX call has succeeded (since it comes from your success handler), so the error handler indeed won’t be called.

If you want to use the same handler for actual AJAX request errors and for further errors originating from your success handler, you can define a named function and use it both as your error handler and from a try/catch block in your success handler:

function handleError(jqXHR, status, exception)
{
    alert("Error running request.");
    // Or print something from 'jqXHR', 'status' and 'exception'...
}

$.ajax({
    data: {
        method: "getCurrentIssues"
    },
    success: function(response, status, jqXHR) {
        try {
            nsNewDebtshowDebtIssues(response);
        } catch (x) {
            handleError(jqXHR, status, x);
        }
    },
    error: handleError
});