AngularJS & Ajax post - how to get ajax error (instead of success) callback to fire

Question

I'm kind of new to ajax so please excuse my ignorance.

In AngularJs, I make an ajax post like so:

            $.ajax({
                url: "http://localhost:65337/api/Account/Register",
                type: "POST",
                beforeSend: function (request) {
                    request.setRequestHeader("Authorization", "Bearer " + $scope.authToken);
                    request.setRequestHeader("Content-Type", "application/json; charset=utf-8");
                },
                datatype: "json",
                data: JSON.stringify(postObj)
            }).error(function (data, status, error) {
                $scope.$emit('MESSAGE', data.Message, data.IsError);
            }).success(function (xmlHttpRequest, status, error) {
                // this callback fires even on server error code 500
            })

and I am trying to get the above error callback to fire when I encounter an internal error on my server, when server encounters an error, I send the following response:

        var response = new HttpResponseMessage(HttpStatusCode.InternalServerError);
        ErrorTModel data = new ErrorTModel(msg, IsError);

        response.Content = new StringContent(
            JsonConvert.SerializeObject(data,
            Formatting.Indented,
            new JsonSerializerSettings() { ReferenceLoopHandling = ReferenceLoopHandling.Ignore }),
            Encoding.UTF8,
            "application/json"
            );

        return response;

I've read everything I can find on google regarding this matter so any assistance would be greatly appreciated.

strongly suggest not mixing jQuery ajax api with angular. Youu really only want to ever have to use jQuery inside angular app for things that angular doesn't support — charlietfl, Jan 11 '15 at 02:43
You have to throw HTTP error code. http://stackoverflow.com/questions/4495961/how-to-send-a-status-code-500-in-asp-net-and-still-write-to-the-response — Sergey Romanov, Jan 11 '15 at 03:25
@charlietfl Thanks for the heads up, after some research, are you referring to $http instead of $ajax ? — OverMars, Jan 11 '15 at 04:42
@OverMars yes. When you use code outside of angular to do things that modify scope you have to notify angular each time. Harder to test and no point doing it when angular has facilities already in place — charlietfl, Jan 11 '15 at 04:48

score 2 · Answer 1 · answered Jan 11 '15 at 02:09

2

I'm not sure what you are trying to achieve with the c# code. The easiest way to get the error callback to fire (for testing purposes) is to throw an exception in your c# code:

throw new Exception();

answered Jan 11 '15 at 02:09

Wayne Ellery

7,888
1
28
45

score 1 · Accepted Answer · answered Jan 12 '15 at 01:26

Instead of

return new HttpResponseMessage(HttpStatusCode.InternalServerError);

create and return the following:

return Request.CreateErrorResponse(HttpStatusCode.InternalServerError, new Exception("Test"));

and the .error callback of any $Ajax or $http method will fire.

Rachel Hathaway · Answer 3 · 2015-01-11T04:04:19.577

0

Leave out a required key/value pair from data that is being posted, referring to postObj on line 9 of the javascript. I would assume that all or part of it is required when posting to an account registration endpoint.

edited Jan 11 '15 at 04:04

answered Jan 11 '15 at 03:17

Rachel Hathaway

1
3

Could you post some example code of what you mean? What data should OP not include in his/her `POST`? How can OP trigger the `error` callback? Answering with explanatory code, in this case, helps to learn where a mistake was made. – Timusan Jan 11 '15 at 03:24
I'm referring to the `postObj` variable on line 9, which is the data being posted to `/api/Account/Register`. I'm not sure what that object contains, but I assume it has a name, password, or some other data used to register an account, and I would think that at least one key/value pair in the object is required. So leave one out. – Rachel Hathaway Jan 11 '15 at 03:49
That would either reject my call to the server or throw an error server side, I'm trying to reverse the flow. When an error is thrown server side, I want to relay that message to the user. – OverMars Jan 11 '15 at 04:45
1

Maybe what Wayne Ellery suggested, `throw new Exception();` in the c# code. We use Django Rest Framework/angular at work, and raising an exception in a DRF view set triggers the failure callback (we generally use angular's `$resource`), that's why I suggested what I did. Works in my case. :-) Good luck – Rachel Hathaway Jan 11 '15 at 05:51
Thnx @RachelHathaway, your suggestion helped me find what I needed. – OverMars Jan 13 '15 at 23:43

AngularJS & Ajax post - how to get ajax error (instead of success) callback to fire

3 Answers3