user3591126
user3591126

Reputation: 211

Javascript AJAX Returns Error

I have an AJAX call:

            $('#testyo').click(function(){
            $.ajax({
                type: 'GET',
                url: "../messages/drew",
                dataType: 'JSON',
                success:function(data){
                 alert(data);
                },
                error: function(data)
                {
                    console.log(data);
                  alert("Error: "+data);
                }
            });
            return false;
            });

It should be successful, but I get the alert("Error: "+data) alert. The data is [object Object]. So the alert just says Error: [object Object]

In my console.log(data)

    Object {readyState: 4, 
getResponseHeader: function, 
getAllResponseHeaders: function, 
setRequestHeader: function, 
overrideMimeType: function…}
abort: function ( statusText ) {always: function () {complete: function () {done: function () {error: function () {fail: function () {getAllResponseHeaders: function () {getResponseHeader: function ( key ) {overrideMimeType: function ( type ) {pipe: function ( /* fnDone, fnFail, fnProgress */ ) {progress: function () {promise: function ( obj ) {readyState: 4responseText: "drew"setRequestHeader: function ( name, value ) {arguments: nullcaller: nulllength: 2name: ""prototype: Object__proto__: function Empty() {}<function scope>state: function () {status: 200statusCode: function ( map ) {statusText: "OK"success: function () {arguments: nullcaller: nulllength: 0name: ""prototype: Object__proto__: function Empty() {}<function scope>then: function ( /* fnDone, fnFail, fnProgress */ ) {__proto__: Object

As you can see it does show the responseText: "drew" which is what I want. I'm just curious to know why is passing through my fail function, and not my success. Please let me know if there is anything else you would need to help me solve this.

Upvotes: 1

Views: 1409

Answers (3)

Niels Steenbeek
Niels Steenbeek

Reputation: 4834

When your responseText returns "drew", your response is not JSON, but String. Remove dataType: 'JSON' and jQuery will use auto detection. Then success function will be called.

JSON should be something like {"myText": "drew"}.

Upvotes: 0

BatScream
BatScream

Reputation: 19700

According to the jquery documentation, the error parameter takes three inputs as parameters:

error:

Type: Function( jqXHR jqXHR, String textStatus, String errorThrown )

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."

The errormessage, and the error can be viewed if you modify the error function to take three parameters input and access the second argument to know what the error string is.

If you do this, it becomes easy to spot the error and know why the request failed. Once you spot the error, it becomes easy to fix it.

unexpected token probably means you've got a corrupted JSON response from the server. Also make sure the response the server component sends is of type JSON.

Set the response type in the server, for example, if the response is json:

response.setContentType("application/json");

See Also:

What is the correct JSON content type?

Refer: http://api.jquery.com/jquery.ajax/

Upvotes: 2

HMR
HMR

Reputation: 39250

I see you get a 200 response but probably your server returns the wrong content type for json or it's completely invalid json.

In Firefox with firebug or chrome try to inspect the response and response headers like content type.

https://stackoverflow.com/a/11112320/1641941

Upvotes: 0

Related Questions