CODEWITHSUNDEEP
javascriptjqueryjson
Michelle Jones
Michelle Jones

Reputation: 9

JSON Formatting Issue?

I am trying to populate an html table of JSON data. I was provided the JSON data and cannot determine why it isn't populating but suspect the JSON may not be formatted properly. When I use other sample data it works, then when I sub in the JSON I was provided it doesn't work. I've tried copying the JSON into a file on my direct server, linking to what I was provided (here: https://boiling-fortress-75456.herokuapp.com/) and inserting it on myjson.com and reformatting the JSON data.

Here is my code:

<script>
    $(function() {

      var entries = [];
      var dmJSON = "https://api.myjson.com/bins/6sjud?callback=?";
      $.getJSON(dmJSON, function(data) {
        $.each(data.entries, function(i, f) {
          var tblRow = "<tr>" + "<td>" + f.rank + "</td>" + "<td>" + f.name + "</td>" + "<td>" + f.march_rank + "</td>" + "<td> " + f.april_rank + "</td>" + "<td>" + f.may_rank + "</td>" + f.personal_volume + "</td>" + f.team_volume + "</td>" + "</tr>"
          $(tblRow).appendTo("#incentive tbody");
        });
      });
    });
    </script>


    <div class="wrapper">
      <div class="profile">
        <table id= "incentive" border="1">
          <thead>
            <th>Rank</th>
            <th>Name</th>
            <th>March</th>
            <th>April</th>
            <th>May</th>
            <th>Highest Rank</th>
            <th>Personal Volume</th>
            <th>Team Volume</th>
          </thead>
        <tbody>

     </tbody>
  </table>

  </div>
 </div>

Upvotes: -1

Views: 67

Answers (1)

Ele
Ele

Reputation: 33726

You need to get the objects from affiliate

$.each(data.affiliate, function(i, f) {
    var tblRow = "<tr>" + "<td>" + f.rank + "</td>" + "<td>" + f.name + "</td>" + "<td>" + f.march_rank + "</td>" + "<td> " + f.april_rank + "</td>" +  "<td>" + f.may_rank + "</td>" + f.personal_volume + "</td>" + f.team_volume + "</td>" + "</tr>"
    $(tblRow).appendTo("#incentive tbody");
});

Response from service

{
    "affiliate":[{          
            "rank":1,"name":"Sally","march_rank":"Gold","april_rank":"Silver","may_rank":"Silver","highest_rank":"Silver","team_volume":12345
        },{
            "rank":2,"name":"Zelda","march_rank":"Gold","april_rank":"Bronze","may_rank":"Silver","highest_rank":"Gold","team_volume":12345
        }
    ]
}

Upvotes: 0

Related Questions