Descriptive error messages

Question

I have the following jQuery which does not give the most descriptive error messsages...

url: 'server_page.aspx',
type: 'POST',
data: { intID:$(this).attr("id"), strState:"1" },
error: function() { alert('Error'); },
success: function() {  }

How do I get more descriptive error messages if it is possible?

EDIT:

This is the full javascript:

$(document).ready(function(){ $("input:checkbox").change(function() { var that = this;

    if($(this).is(":checked")) { 
        $.ajax({
            url: 'favorite_on_off.aspx',
            type: 'POST',
            data: { strFavoriteID:$(that).attr("id"), strState:"1" },
            timeout: 1000,
            error: function(xhr, status, error)
            {
                alert("values: strFavoriteID: " + $(that).attr("id") + " strState: " + "1");
                alert('Error: ' + status + '\nError Text: ' + error);  
            },
            success: function() {  }
        });
    } else {
        $.ajax({
            url: 'favorite_on_off.aspx',
            type: 'POST',
            data: { strFavoriteID:$(that).attr("id"), strState:"0" },
            timeout: 1000,
            error: function(xhr, status, error)
            {
                alert("values: strFavoriteID: " + $(that).attr("id") + " strState: " + "0");
                alert('Error: ' + status + '\nError Text: ' + error);  
            },
            success: function() {  }
        });
    }
}); 

});

These are the error messages:

values: strFavoriteID: c:\folder\document.doc strState: 1

Error: error Error Text: undefined

Answer 1

The second argument provided to the error callback is textStatus, which should contain a description of the error:

error: function(xhr, textStatus) { alert(textStatus); }

Note that you should probably not provide this information to your users. Parse the message using Javascript and give them a nice friendly message explaining the error.

Answer 2

You can use all of the arguments passed to the error callback, for example:

error: function(xhr, status, error) { 
  alert('Error: ' + status + '\nError Text: ' + error); 
},

Answer 3

I have this method:

function HandleAjaxError(request, status, error) {
    var ex = eval("(" + request.responseText + ")");

 $('body').addClass("ui-widget-overlay");
    alert(ex.Message);
    $('body').removeClass("ui-widget-overlay");
}

$.ajax({
    type: "POST",
    url: window.location.pathname + "/DoStuff",
    data: "{}",
    success: Success,
    error: HandleAjaxError
});

This way, I can gracefully handle the error message (and possibly the status code) on the ASP.NET side. I usually log the original error, then throw a custom/descriptive one for the client.