Michael BW
Michael BW

Reputation: 1070

Trapping Function not defined error in Javascript and jQuery

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.

Upvotes: 2

Views: 1568

Answers (3)

Frédéric Hamidi
Frédéric Hamidi

Reputation: 262939

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
});

Upvotes: 1

Gabriele Petrioli
Gabriele Petrioli

Reputation: 195992

It is not an ajax error, so you cannot handle it from the ajaxError method.

You should do a try/catch in the success method.

success: function(response) {
    try {
        nsNewDebtshowDebtIssues(response);
    } catch (ex) {
        //exception occured
        //alert("Error running nsNewDebt.showDebtIssues");
        alert( ex.message + '\n\tin file : ' + ex.fileName + '\n\t at line : ' + ex.lineNumber);
    }
}

Upvotes: 3

techfoobar
techfoobar

Reputation: 66663

Before making the call, you can do:

if(typeof nsNewDebtshowDebtIssues == 'function') {
  // .. call it ..
}

Upvotes: 2

Related Questions