javascript - Trying to use jQuery to display JSON text data

Question

I know very little (none) JavaScript, or much about using API's. However I would like to display some hotel reviews on my webiste made available over the qype.com API. However I'm struggling with being able to manage this.

This is the code I have so far:

$(document).ready( function() {
  $.getJSON( "http://api.yelp.com/business_review_search?term=hilton%20metropole&location=B26%203QJ&ywsid=APIKEY Removed",
    function(data) {
      $.each( data.businesses, function(i,businesses) {
        content = '<p>' + businesses.reviews.text_excerpt + '</p>';
        content = '<p>' + businesses.reviews.date + '</p>';
        $(content).appendTo("#review");
      } );
    }
  );
} );

I have a div in the body called review where I want to display the text.

Any advice greatly received.

JSON can be found at http://api.yelp.com/business_review_search?term=hilton%20metropole&location=B26%203QJ&ywsid=lOoGGbkYpVmTvxHlWGT2Lw

Also, I have multiple businesses on the same page, how would I make use of this multiple times on the same page, but output the data in different locations?

Answer 1

Update: Ah, I see your error now. businesses.reviews is an array (each business can have more than one review) so you have to loop over each business and each business' reviews.

i had to change some things to get it to run in my test bed, but you can see a sample of this code running here: http://bit.ly/4mTxPp

yelp currently support JSONP calls so you can change your code to:

<script src="http://code.jquery.com/jquery-latest.js"></script>

<script>
function showData(data) {
    $.each(data.businesses, function(i,business){
        // extra loop
        $.each(business.reviews, function(i,review){ 
            var content = '<p>' + review.text_excerpt + '</p>';
            content += '<p>' +review.date + '</p>';
            $(content).appendTo('#review');
        });
    });      
}


$(document).ready(function(){
    // note the use of the "callback" parameter
    writeScriptTag( "http://api.yelp.com/business_review_search?"+
    "term=hilton%20metropole"+
    "&location=B26%203QJ"+
    "&ywsid=lOoGGbkYpVmTvxHlWGT2Lw"+
    "&callback=showData"); // <- callback
});

function writeScriptTag(path) {
    var fileref = document.createElement('script');
    fileref.setAttribute("type","text/javascript");
    fileref.setAttribute("src", path);

    document.body.appendChild(fileref);
}
</script>