Question

This is driving me nuts, I have been through every article I have seen on Google and here and two days later, 101 variants later I am still no further forward.

The success 201 works perfectly, I get an alert with bound items. The 404 doesn’t work at all, no matter what I try the ErrorDesc is always undefined. I have got it working that it can hit this 404 function with a fixed string, but I want the user to know why there is an error.

I have used fiddler to look at the request and response. It looks fine, both the request and response are well formed JSON:

Raw Request:

{"Bedrooms":"3","BuildingsAD":"Yes","BuildingsMD":"No","BulidingSI":"100000","ContentsAD":"No","ContentsMD":"No","ContentsPOL":"No","ContentsSI":"5000","EffectiveDate":"03/10/2012 23:40:10","EL":"N","MD":"No","NCD":"1","POL":"No","PropType":"Terraced","RiskPostcode":"SW19 1TS","SchemeRef":"20","TA":"No","TenantTheft":"No","TenantType":"Professional","Theft":"No","TransactionDate":"03/10/2012 23:40:10","VolExcess":"250","YearBuilt":"2000 +","ErrorDesc":"123"}

Raw Response:

{"RatingId":"f5733e9d-bc9d-4026-8d5f-ce4f750a3a42","SchemeRef":"20","EffectiveDate":"03/10/2012 23:40:10","TransactionDate":"03/10/2012 23:40:10","Bedrooms":"3","BuildingsAD":"Yes","BuildingsMD":"No","BulidingSI":"100000","ContentsAD":"No","ContentsMD":"No","ContentsPOL":"No","ContentsSI":"5000","EL":"N","MD":"No","NCD":"1","POL":"No","PropType":"Terraced","RiskPostcode":"SW19 1TS","TA":"No","TenantTheft":"No","TenantType":"Professional","Theft":"No","VolExcess":"250","YearBuilt":"2000 +","Error":true,"ErrorDesc":"Rating Sheet not found"}


    <script type="text/javascript">

        function CalcRating() {
            //create a Json object based on data entered by user
            var RatingItems = {
                AD: $("#AD").val(),
                AdminFee: $("#AdminFee").val(),
                Bedrooms: $("#Bedrooms").val(),
                BuildingsAD: $("#BuildingsAD").val(),
                BuildingsMD: $("#BuildingsMD").val(),
                BuildingsPremium: $("#BuildingsPremium").val(),
                BulidingSI: $("#BulidingSI").val(),
                ContentsAD: $("#ContentsAD").val(),
                ContentsMD: $("#ContentsMD").val(),
                ContentsPOL: $("#ContentsPOL").val(),
                ContentsPremium: $("#ContentsPremium").val(),
                ContentsSI: $("#ContentsSI").val(),
                EffectiveDate: $("#EffectiveDate").val(),
                EL: $("#EL").val(),
                IPT: $("#IPT").val(),
                MD: $("#MD").val(),
                NCD: $("#NCD").val(),
                POL: $("#POL").val(),
                PropType: $("#PropType").val(),
                RatingId: $("#RatingId").val(),
                RiskPostcode: $("#RiskPostcode").val(),
                SchemeRef: $("#SchemeRef").val(),
                TA: $("#TA").val(),
                TenantTheft: $("#TenantTheft").val(),
                TenantType: $("#TenantType").val(),
                Theft: $("#Theft").val(),
                TransactionDate: $("#TransactionDate").val(),
                TotalPremium: $("#TotalPremium").val(),
                VolExcess: $("#VolExcess").val(),
                YearBuilt: $("#YearBuilt").val(),
                ErrorDesc: "123"
            };
            //call jQuery Ajax method which calls Json.stringify method to convert
            //the Json object into string and send it with post method
            $.ajax({
                url: "/api/qsletpropertyom",
                data: JSON.stringify(RatingItems),
                type: "POST",
                contentType: "application/json;charset=utf-8",
                statusCode: {
                    201: function (result) {
                        alert("Total Premium: " + result.TotalPremium + ", Total Buildings Premium " + result.BuildingsPremium + ", Total Contents Cover " + result.ContentsPremium + ", Admin Fee " + result.AdminFee);
                    },
                    404: function (result1) {

                        alert(result.ErrorDesc);

                    },
                    500: function (result2) {
                        alert("Unknown Error");
                    }

                }
            });
        }

Please let me know the error of my ways!!

Answer 1

First of all, you’re using result.ErrorDesc when you were probably expecting result1.ErrorDesc – but that’s just a typo I guess.

Second of all, if I get you right, you want to display error description to the user when ajax hits 404 (page not found)? If so, most likely you won’t be able to do that since there is no data passed to your 404 handler.

Perhaps you’re looking for something else like error option for ajax (http://api.jquery.com/jQuery.ajax/).

From jQuery documentation: error “A function to be called if the request fails. The function receives three arguments: The jqXHR (in jQuery 1.4.x, XMLHttpRequest) object, a string describing the type of error that occurred and an optional exception object, if one occurred. Possible values for the second argument (besides null) are “timeout”, “error”, “abort”, and “parsererror”. When an HTTP error occurs, errorThrown receives the textual portion of the HTTP status, such as “Not Found” or “Internal Server Error.” As of jQuery 1.5, the error setting can accept an array of functions. Each function will be called in turn. Note: This handler is not called for cross-domain script and JSONP requests.”

$.ajax({
    url: "/api/qsletpropertyom",
    data: JSON.stringify(RatingItems),
    type: "POST",
    contentType: "application/json;charset=utf-8",
    error: function(jqXHR, textStatus, errorThrown) {
        // textStatus will contain "Not Found" for 404 errors
    }
});

EDIT:
Apparently, the 404 handler used in statusCode map definition (as you did) gets 3 arguments, just as error option does. Here’s working example: http://jsfiddle.net/QsHdV/2/

Note that first argument you get there is jquery XHR object not some result data.