Loading JSON Data with Jquery

Question

I'm trying to follow this tutorial: http://www.9lessons.info/2009/10/json-jquery-ajax-php.html

Here is my code: http://jsfiddle.net/9ujd8s8r/1/

How comes that it doesn't load the JSON data into the page with this code?

$(function () {
    $(".load").click(function () {
        $.getJSON("http://demos.9lessons.info/data.json", function (data) {
            $.each(data.posts, function (i, data) {
                var div_data = "<div class='box'><a href='" + data.url + "'>" + data.title + "</a></div>";

                $(div_data).appendTo("#9lessonsLinks");
            });
        });
        return false;
    });


});

You have not define "9lessonsLinks" id anywhere in the html. define it. due to that your data is not populating. — Code Lღver, Sep 12 '14 at 13:40
By the way, [mentioned site](http://www.9lessons.info/2009/10/json-jquery-ajax-php.html) has awful code indentation. To be honest, it doesn't have code indentation at all... — Regent, Sep 12 '14 at 13:40

score 1 · Answer 1 · edited May 23 '17 at 11:44

1

Check your console for errors. The following error is showing:

XMLHttpRequest cannot load http://demos.9lessons.info/data.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://fiddle.jshell.net' is therefore not allowed access.

For more information see "No 'Access-Control-Allow-Origin' header is present on the requested resource".

edited May 23 '17 at 11:44

Community

1
1

answered Sep 12 '14 at 13:40

Dan

9,391
5
41
73

score 0 · Answer 2 · answered Sep 12 '14 at 13:41

0

Your code seems correct. It's a problem of crossdomain. You try to access resource in another server which has not defined that you can.

http://jquery-howto.blogspot.fr/2013/09/jquery-cross-domain-ajax-request.html

answered Sep 12 '14 at 13:41

T00rk

2,178
3
17
23

2

Note: JSONP won't help here as the server doesn't provide a JSONP service. – Andy Sep 12 '14 at 13:47
Yes but there is 5 other methods which can maybe help – T00rk Sep 12 '14 at 13:50
Yes, and I was simply pointing out that one of them won't work. – Andy Sep 12 '14 at 13:54

Loading JSON Data with Jquery

2 Answers2