Why are these .getJSON and .ajax functions behaving differently?

Question

I am trying to load a remote json file asynchronously. I've just spent a long time trying to debug the function that I expected to work. I'm still relatively new to JS, and would like to understand why teh following occurs.

The function I expected to work returns undefined.

$.ajax({
  dataType: 'json',
  url: $url
})
.done(function(data) {
  console.log( data );
});

Whereas this function returns the expected json object

$.getJSON( $url, function( data ) {
  console.log(data);
});

I thought these functions are equivalent. What is happening here?

score 0 · Answer 1 · answered Oct 31 '16 at 05:52

0

You are setting a wrong attribute in the ajax method. type is meant to be GET, POST, etc. but you are setting it up to json.

"type is an alias for method. You should use type if you're using versions of jQuery prior to 1.9.0."

For that to be correct, you need to set the dataType to 'json' and everything should fall in place. You can read more about ajax API on jQuery Docs site

answered Oct 31 '16 at 05:52

Sreekanth

3,110
10
22

so, is it still undefined after the dataType change? – Sreekanth Oct 31 '16 at 05:57
Yes, it is still undefined – Andy Harvey Oct 31 '16 at 05:58
which version of jQuery are you using? – Sreekanth Oct 31 '16 at 05:58
I'm using jquery 3.1.0 – Andy Harvey Oct 31 '16 at 06:40
would you please update the data you are reading from the server? console.log(data) – Sreekanth Oct 31 '16 at 06:44

score 0 · Answer 2 · answered Oct 31 '16 at 05:58

0

try this instead

$.ajax({
  dataType: 'json',
  url: $url,
  success: function(data)
  {
    console.log( data );
  }
})

answered Oct 31 '16 at 05:58

Daniel Tamayo

25
8

thanks @daniel, what is the difference between `success` and the `done` callback? – Andy Harvey Oct 31 '16 at 06:45
Let me refer you to this link for explanation. http://stackoverflow.com/questions/8840257/jquery-ajax-handling-continue-responses-success-vs-done – Daniel Tamayo Oct 31 '16 at 07:13

Why are these .getJSON and .ajax functions behaving differently?

2 Answers2