1

I'm trying to fetch and parse json data so I could output it to a blank HTML file. The problem that keeps occurring to me is that if I fetch the data and parse it I get a Uncaught TypeError: Cannot read property 'SOCENGPRE' of undefined error. If I fetch the json data in dataType: "text" format I get the XMLHttpRequest cannot load <api url> No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. error. The website is on a local machine and I cannot edit the server to be cross-platformed because of person reasons. The code looks like this :

var myDataVar;
function main() {
    $.ajax({
        url: "http://api&leagues=SOCENGPRE&format=jsonp&callback=?",
        dataType: "json",
        success: function (data) {
            myDataVar = $.parseJSON(data);
            getUpcomingFixtures();
        }
    });
}
function getUpcomingFixtures() {
    for (var i = 0; i <= myDataVar.SOCENGPRE.fixtures.length - 1; i++) {
        console.log(myDataVar.SOCENGPRE.fixtures[i].id);
        console.log(myDataVar.SOCENGPRE.fixtures[i].home_team + " vs " + myDataVar.SOCENGPRE.fixtures[i].away_team);
    }
}

An example of the data being fetched looks like this :

{
    "SOCENGPRE": {
        "league_name": "Barclays Premier League",
        "league_phid": null,
        "league_type": null,
        "fixtures": [{
            "id": "64714",
            "code": "SOCENGPRE",
            "event_slug": "west_ham-tottenham-1401290",
            "start": "1399117500",
            "home_team": "West Ham",
            "home_team_phid": null,
            "home_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t523.png",
            "home_team_short": "",
            "away_team": "Tottenham",
            "away_team_phid": null,
            "away_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t498.png",
            "away_team_short": "",
            "phid": null
        }, {
            "id": "64711",
            "code": "SOCENGPRE",
            "event_slug": "manchester_u-sunderland-1401286",
            "start": "1399125600",
            "home_team": "Manchester U",
            "home_team_phid": null,
            "home_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t20790.png",
            "home_team_short": "Man U",
            "away_team": "Sunderland",
            "away_team_phid": null,
            "away_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t382.png",
            "away_team_short": "",
            "phid": null
        }, {
            "id": "64712",
            "code": "SOCENGPRE",
            "event_slug": "stoke-fulham-1401288",
            "start": "1399125600",
            "home_team": "Stoke",
            "home_team_phid": null,
            "home_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t389.png",
            "home_team_short": "",
            "away_team": "Fulham",
            "away_team_phid": null,
            "away_team_logo": "\/\/dxnxhx88pdxyv.cloudfront.net\/logo\/32\/t379.png",
            "away_team_short": "",
            "phid": null
        }]
    }
}

My goal is to just fetch the fixture id and the two teams competing. Any clue what I'm doing wrong?

hoeRIZON
  • 59
  • 6
  • 1
    Also, you shouldn't call `$.parseJSON` on the text, it's already called by jQuery and will cause an error if you try and parse it again. – Qantas 94 Heavy May 02 '14 at 04:44

1 Answers1

0

Try using the below code , don't parse the JSON again as it is already handled, assuming string is your JSON object.

At beginning of script declare this variable result as array;

var result = [];


function getUpcomingFixtures() {
  $.each( string , function ( i , val) {

     $.each( val['fixtures'] , function ( k , fixturesData) {

      result.push( { id: fixturesData.id , 
                     hometeam : fixturesData.home_team , 
                     awayteam : fixturesData.away_team
                    } 
                  );
      });

  });
}
sshet
  • 1,152
  • 1
  • 6
  • 15