json array only gets populated with first value

Question

Hi i have a problem with a local file wich stores some json data

{
  "tournament": [{
    "TeamName": "AS Roma",
    "TeamPlayer": "Rickard"
  } {
    "TeamName": "Inter",
    "TeamPlayer": "Bobban"
  }]
}

Then on buttonclick i try to populate an array with this data. But it only takes "AS Roma" and "Rickard" instead of "As Roma" "Rickard" AND "Inter" "Bobban".

// Get teams
var url = "http://localhost:57608/json/teams.txt";
$("#btnGetTeams").on('click', function() {
    var allItems = [];
    $.getJSON(url, function(data) {
        $.each(data, function(i, team) {
            allItems.push({
                theTeam: team.tournament.TeamName,
                thePlayer: team.tournament.TeamPlayer
            });
        });
        $.each(allItems, function(i, val) {
            $('#teams').append('<p>' + val.theTeam + val.thePlayer + '</p>');
        });
    });
});

So instead of output AS Roma Rickard Inter Bobban, it only writes AS Roma Rickard. What am i doing wrong?

Update Fully working code thanks to Sushanth

// Get teams
var url = "http://localhost:57608/json/teams.txt";
$("#btnGetTeams").on('click', function () {
                var allItems = [];
                $.getJSON(url,
                         function (data) {                               
                                 $.each(data.tournament, function (i) {
                                     allItems.push({
                                         theTeam: data["tournament"][i]["TeamName"],
                                         thePlayer: data["tournament"][i]["TeamPlayer"],
                                     });
                                 });
                             $.each(allItems, function (i, val) {
                                 $('#teams').append('<p>' + val.theTeam + val.thePlayer + '</p>');
                             });                                 
                         });
            });

With Json

{
"tournament": [
        {
            "TeamName": "AS Roma",
            "TeamPlayer": "Rickard" 
        },
        { 
            "TeamName": "Inter",
            "TeamPlayer": "Bobban" 
        }
            ]

}

Sushanth -- · Accepted Answer · 2012-11-02 19:59:01Z

2

Missing comma in your JSON

},  <-- Missing comma between two objects
 {

Also you are accessing the json in a wrong way .. Your json is an array of Objects

$.each(data.tournament, function (i, team) {
       allItems.push({
                        theTeam : team.TeamName,
                        thePlayer: team.TeamPlayer
    });
});

Check Fiddle

enter image description here

Try this Way with bracket Notation..

$.each(data.tournament, function(i) {
    allItems.push({
        theTeam: data["tournament"][i]["TeamName"],
        thePlayer: data["tournament"][i]["TeamPlayer"],
    });
});

Fiddle Bracket Notation

If this does not work use a for loop

var allItems = [];
var data = data.tournament;
var i = 0;
for(key in data){
     allItems.push({
        theTeam: data[i].TeamName,
        thePlayer: data[i].TeamPlayer,
    });

}

For Fiddle

edited Nov 2, 2012 at 19:59

answered Nov 2, 2012 at 18:48

Sushanth --

55.8k9 gold badges70 silver badges109 bronze badges

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

26 Comments

rickard Over a year ago

Thanks for spotting a missing comma. Though i tried change the code as you said data.tournament. But now i get no output instead :/

rickard Over a year ago

I can see that the fiddle shows a working example. But if i do the same, except i also have to include the .getJson result gives me nothing.

rickard Over a year ago

when using debugger i get, Uncaught TypeError: Cannot read property 'length' of undefined

rickard Over a year ago

thanks for still hanging around :), see update for new code inside click event

Sushanth -- Over a year ago

In which line do you see the error ?? Check if you see the error inside the click event

|

Collectives™ on Stack Overflow

json array only gets populated with first value

1 Answer 1

26 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

26 Comments

Your Answer

Sign up or log in

Post as a guest

Related