getJson and parse to create a list (for now) jQuery/Yahoo Finance API

Question

I almost have the thing working but I can't get past a parsing issue. If anyone can help I would be very thankful!

I am trying to query Yahoo Finance API and parse the results using jQuery. Here is my code to do so:

  <script>
$(document).ready(function(){

var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D'NPO'&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback";

$.getJSON(url + "&format=json&jsoncallback=?", function(data) {
  var items = [];

  $.each(data, function(key, val) {
    items.push('<li id="' + key + '">' + val + '</li>');
  });

  $('<ul/>', {
    'class': 'my-new-list',
    html: items.join('')
  }).appendTo('body');
});


});
</script>

But I am getting this error:

Any help overcoming this error would be much appreciated.

Thanks!

Answer 1

• jsoncallback parameter is not used by the service.
• You even don't have to specify callback parameter. It is added by the getJSON()
• format parameter is already specified in url
• Your items array is storing objects as the data are under data.query.results.quote

Try this:

var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D'NPO'&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys";

$.getJSON(url, function(data) {
  var items = [];
  $.each(data.query.results.quote, function(key, val) {
    items.push('<li id="' + key + '">' + val + '</li>');
  });
  $('<ul/>', { 'class': 'my-new-list', html: items.join('')}).appendTo('body');
});

Working code is HERE.

Answer 2

YQL uses a callback=? parameter, not jsoncallback=? try this:

var url = "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D'NPO'&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys";

$.getJSON(url + "&format=json&callback=?", function(data) {

Edit: Note, the url had to change too.

Answer 3

Works fine for me when you remove the &jsoncallback=?.

$(document).ready(function() {

    var url = "http://query.yahooapis.com/v1/public/yql?" +                    
              "q=select%20*%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D'NPO'" + 
              "&format=json&diagnostics=true" + 
              "&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys";

    $.getJSON(url, function(data) {

        console.log( data );

    });
});

You actually already have the format=json in the main string.

JSFIDDLE DEMO