How do I load external JSON from a script on a web page?

Question

I'm trying to load data from an external .js file, containing a json representation of a bunch of data. I cannot for the life of me figure out how to access the data inside the page. I'm sure this is really easy and I'm missing something simple! right now, I'm trying this:

  $(document).ready(function(){
    $.getJSON("http://api.crunchbase.com/v/1/company/xobni.js",
        function(data){
            alert(data.company_url);
        });
  });

...which is obviously very wrong, since nothing happens. I've tried loading it in a <script> tag, but firebug tells me it didn't even load. how could I screw that up? anyway, I'm about ready to pull my hair out, and I figure this will take someone else about 15 seconds to figure out.

Answer 1

Looks okay at first glance. Are you sure that the response is valid JSON? Is the content-type incorrect, perhaps? Is the source URL on the exact same domain as your page? (including protocol and port number)

edit:

I loaded your JSON, and there's no "company_url" property.

Answer 2

that data file doesn't have company_url entry. Additionally, the .js file is served with text/javascript mime-type, when it should be served with application/json (or application/x-javascript, correct me on that).

The real reason, of course, is that you need to add ?callback=? to your url. Then everything is going to work. So, it'll look like this:

$(document).ready(function(){
    $.getJSON("http://api.crunchbase.com/v/1/company/xobni.js?callback=?",
        function(data){
            alert(data.homepage_url);
        });
  });

Answer 3

I looked at the json data. It looks like there is no company_url. You might want homepage_url

$(document).ready(function(){
   $.getJSON("http://api.crunchbase.com/v/1/company/xobni.js",
      function(data){
             alert(data.homepage_url);
         });
   });