0

Nothing appears in the content.

jQuery(function($) {

$.getJSON('http://countdown.tfl.gov.uk/stopBoard/55191')
    .success(function(response) {
        var $content = $('#content')
            .html(response.arrivals[0].destination);

        });
});

DIV Section:

 <div id="content"></div>

Fiddle: http://jsfiddle.net/zax2n/1/

Cody Raspien
  • 1,753
  • 5
  • 26
  • 51
  • 3
    `XMLHttpRequest cannot load http://countdown.tfl.gov.uk/stopBoard/55191. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://fiddle.jshell.net' is therefore not allowed access.` Always check your console for errors. – Cerbrus Apr 15 '14 at 13:46
  • This is answered here as well along with explanation / examples: http://stackoverflow.com/a/19821851/3535297 – haxtbh Apr 15 '14 at 13:50
  • Basically you can't access resources outside your own server, it's a known issue in web development (there are some work arounds though). – jarandaf Apr 15 '14 at 13:51
  • you have to use jsonp or do a cross-origin request. Ofc server has to support one of them. – Eru Apr 15 '14 at 13:52
  • I have no clue how to retrieve and manipulate data using JS. Any examples? – Cody Raspien Apr 15 '14 at 13:58
  • Update - Added the AJAX part and still nothing http://jsfiddle.net/W6new/5/ – Cody Raspien Apr 15 '14 at 14:24

1 Answers1

0

As mentioned in other comments, nothing is happening because you're receiving the Access-Control-Allow-Origin header error. However, there is an easy way around this: JSONP.

$.ajax("http://countdown.tfl.gov.uk/stopBoard/55191", {
    dataType: "jsonp",
    success: function(data){
        console.log(data);
    },
    error: function(data, textStatus, errorThrown){
        console.log(textStatus);
    }
});

By specifying through the longhand $.ajax() method that you are requesting JSONP, you'll get your JSON object in response.

Check out this updated fiddle. Open your console and you'll see that everything is working, but there's a parse error (the JSON you're getting back might be malformed).

James Hafner
  • 478
  • 2
  • 6