$getJSON not working - undefined is the result

Question

Here is the JSON I am trying to parse

{"sites":{"1":{"id":1,"company":"facebook","username":"abc@gmail.com","hint":"mascot"}}}

Here is the javascript parsing it. It was working then the structure of the JSON changed and I cannot for the life of me get it work. The result is 'undefinedundefined' which means that it does not understand what username and hint are. Any thoughts?

$.getJSON('http://localhost:3000/sites.json', 'limit=30', processWebsites);
        function processWebsites(data) {
        var infoHTML='';


        $.each(data, function(website, websiteDetails) {
        infoHTML+= websiteDetails.username
        infoHTML+= websiteDetails.hint;
        });

        $('#info').html(infoHTML);
        }

and finally the HTML

  <body>

      <div id = "info">

      </div>

  </body>

follow up question - is there a way to add a line break after each line of JSON. I now have 2 rows of JSON and it is all together on one line. Does the go in the js code in the .each of the infoHTML below? — brad, Aug 27 '13 at 18:44

score 0 · Accepted Answer · answered Aug 27 '13 at 18:41

0

i needed a .sites after data. this fixed it.

answered Aug 27 '13 at 18:41

brad

1,675
2
16
23

james emanon · Answer 2 · 2013-08-27T19:00:09.403

I believe felix is correct above. If you just console this, you'll get the value you need. update: add your breaks

var infoHTML = [];
var data = {"sites":{"1":{"id":1,"company":"facebook","username":"abc@gmail.com","hint":"mascot"}}};

jQuery.each(data.sites, function(){
  infoHTML.push(this.username + '<br>' + this.hint);
});

If you happen to get more than one grouping, then just join them with 2 br's if you want some seperation.

$('#info').html(infoHTML.join('<br><br>'));

I am sure there are much more eloquent ways. this is just fast and dirty.

$getJSON not working - undefined is the result

2 Answers2