Jquery not reading from JSON file

Question

Ok, so here is the code for my HTML:

<div id="contentholder">
    <div class="personcard">
        <img src="http://placehold.it/400x400" />
        <h2>Matej Vydra <span>Striker</span></h2>
        <p>This is a paragraph about Watford Striker Matej Vydra, it doesnt really make much sense, but its great for testing and lolz.</p>
    </div>
</div>

and here is the JS and JSON files:

$(document).ready(function () {
    $.getJSON('json/currentsquad.json', function (currentsquad) {
        var output = "<div class='personcard'>";
        for (var i in currentsquad.players) {
            output += "<img src='" + currentsquad.players[i].image + "'/> <h2>" + currentsquad.players[i].name + "<span>" + currentsquad.players[i].position + "</span> </h2>";
        }
        output += "</div>";
        document.getElementById("contentholder").innerHTML = output;
    });
});

json:

{
    "players": [
        {
            "image": "http://placehold.it/400x400",
            "name": "Matej Vydra",
            "position": "Striker"
        },
        {
            "image": "http://placehold.it/400x400",
            "name": "Troy Deeney",
            "position": "Striker"
        },
]
}

And the problem is that the code is not getting shown to the user, I have tried searching previously and therefore tried running it on localhost but the issue stays the same and the JSON isn't shown to the user. Thanks in advance.

Remove the last comma after the }, in the data in currentsquad.json file. — Shiva
– Shiva, Commented Jul 27, 2015 at 22:56
How are you getting that extra comma in the first place. No decent JSON generator would create it. Are you trying to build it yourself? Is the trailing comma actually there? — user1106925
– user1106925, Commented Jul 27, 2015 at 23:14

Felipe Skinner · Accepted Answer · 2015-07-27 23:10:09Z

2

Your JSON is invalid. While the JavaScript object literal notation allows for a trailing comma, the JSON standard does not. So if this is an accurate representation of the JSON you're sending, you'll need to remove the comma after the last object in the players Array.

{
    "players": [
        {
            "image": "http://placehold.it/400x400",
            "name": "Matej Vydra",
            "position": "Striker"
        },
        {
            "image": "http://placehold.it/400x400",
            "name": "Troy Deeney",
            "position": "Striker"
        }
    ]
}

edited Jul 27, 2015 at 23:10

answered Jul 27, 2015 at 22:54

Felipe Skinner

16.6k2 gold badges27 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

user1106925 Over a year ago

Give a half-way decent explanation of exactly what you changed and why, and I'll remove the vote. It's technically correct but very low quality.

Felipe Skinner Over a year ago

well you dont need to downvote for that, you could just ask

user1106925 Over a year ago

@FelipeSkinner: Why wouldn't I? Votes are for rating the quality of the answer. Give better answers, you'll get better voting feedback.

user1106925 Over a year ago

Fair point about the comment, though I very seriously doubt that the OP would be dumb enough to actually include the comment in the rendered JSON.

Felipe Skinner Over a year ago

hehehe i don't know but there are lots of beginners around that might not know that... just want to be sure :)

|

Collectives™ on Stack Overflow

Jquery not reading from JSON file

1 Answer 1

7 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Related