CODEWITHSUNDEEP
javascriptjsonapijquery
user2314110
user2314110

Reputation: 191

Ajax call fires error event but returns 200 ok

$.ajax({
        url: 'http://intern-dev01:50231/api/language',
        type: 'GET',
        dataType: 'json',
        success: function() {
            console.log('It Works!');
        },
        error: function (request,status, error) {
            console.log(error);
            alert(status);
        }
    });

Why do this ajax call not work ?? if i call in browser it works fine :/.

This is what fiddler returns:

HTTP/1.1 200 OK
Content-Length: 122
Content-Type: application/json; charset=utf-8
Server: Microsoft-HTTPAPI/2.0
Date: Fri, 26 Apr 2013 06:56:40 GMT

[{"LanguageId":1,"LanguageName":"Dansk"},{"LanguageId":2,"LanguageName":"Tysk"},{"LanguageId":3,"LanguageName":"Engelsk"}]

Upvotes: 16

Views: 38080

Answers (5)

DaveS
DaveS

Reputation: 101

Check the url parameter and make sure its the same as the loaded page. You might be doing a cross-domain ajax call. If you were wanting to make a cross-domain ajax call, notice that the only dataTypes allowed to make cross-domain requests are "script" and "jsonp".

Ran into this issue in a dev environment where the URL was an IP address and the page loaded a domain-name pointing to that ip.

Upvotes: 1

dush88c
dush88c

Reputation: 2106

If you are testing locally with a different web app and web API applications , then debug your application and test API send data correctly and app calls to API via AJAX and return data.

since domains are not similar when run application AJAX call doesn't hit to success function. because browser prevents Cross Site request. If you publish both app in local and debug , it's work fine.

hope this would be helpful someone.

Upvotes: 0

Senju
Senju

Reputation: 1035

I know I'm a little late, but I just ran into the same problem and this is one of the top search results on Google. I managed to fix it by moving datatype above url like this:

$.ajax({
    type: 'GET',
    dataType: 'json',
    url: 'http://intern-dev01:50231/api/language',
    success: function() {
        console.log('It Works!');
    },
    error: function (request,status, error) {
        console.log(error);
        alert(status);
    }
});

Upvotes: 0

SanTheta
SanTheta

Reputation: 125

There is a parsing error since the status shows 200 OK. The problem lies in the datatype:json. To test this, remove the line and it should work. In order to fix this, you can change it to the datatype:text. See this link too for similar question

Upvotes: 9

Bharat Chodvadiya
Bharat Chodvadiya

Reputation: 1650

You have to check ajax response if it is valid or not. When you specify in ajax:

dataType: 'json',

jQuery will fire the error event if the response cannot be parsed as JSON, even if server returns 200 OK. Check the data returned from the server and make sure it is valid JSON (try JSONLint service).

If the returned data is not JSON or it has syntax errors then fix them in your server side code. You can just return {} from the server side script.

Also try this.

$.ajax({
    url: 'http://intern-dev01:50231/api/language',
    type: 'GET',
    cache: false,        
    complete: function (xhr, status) {
      if (status === 'error' || !xhr.responseText) {
          console.log(error);
          alert(status);
      }
      else {
       console.log('It Works!');.
      }
    }        
});

Upvotes: 21

Related Questions