loop over an array of objects with jquery?

Question

I have this script that creates a list of a JSON object. I can only get this to find and show the first object. I need some help for how to loop this so i can get all results from JSON.

<script>

$(function() {


   var list = [];


$.getJSON('list.json', function(data) {
   $.each(data.list[1], function(i, f) {
      var tblRow = "<tr>" + "<td>" + f.title + "</td>" +
       "<td>" + f.status + "</td>" + "<td>" + f.party + "</td>" + "<td>" + f.author + "</td>" + "</tr>"
       $(tblRow).appendTo("#listdata tbody");
 });

});

});
</script>

JSON

{
"list": [
{
"fields": {
"id": "23435443543345",
"title": "02374423 233334-2334Josephine Kjellme Hi3G",
"status": "signed",
"state": "Closed",
"party": "Josephine 2222",
"partner": "Josephine 33333",
"partnercomp": "",
"author": "Team 2 Long",
"time": "2014-06-11T12:40:52Z",
"ctime": "2014-06-11T12:37:38Z",
"timeouttime": "2014-06-25T21:59:59Z",
"template": false,
"partiescount": 2,
"type": "signable",
"process": "contract",
"authentication": "standard",
"delivery": "mixed",
"deliveryMethods": [
 "email",
 "pad"
  ],
"anyinvitationundelivered": false,
"shared": false,
"file": "9222591556598841091",
"inpadqueue": false,
"deleted": false,
"reallydeleted": false,
"canperformsigning": false,
"isviewedbyauthor": false,
 "objectversion": 44
 },
 "subfields": [
 {
 "id": "2342342342342342",
 "status": "signed",
 "name": "Josephine 4444",
 "time": "2014-06-11T12:40:43Z",
 "invitationundelivered": false,
 "inpadqueue": false,
 "isauthor": false,
 "authentication": "standard",
 "delivery": "pad"
}
],
 "link": "/d/435345345345435",
 "isauthor": false,
 "docauthorcompanysameasuser": true
 },
 {
"fields": {
"id": "643553433",
"title": "0760097129 444444-3040 Maria 44444Hi3G",
"status": "signed",
"state": "Closed",
"party": "Maria Petersson",
"partner": "Maria Petersson",
"partnercomp": "",
"author": "Team Family 2",
"time": "2014-06-11T12:38:00Z",
"ctime": "2014-06-11T12:33:29Z",
"timeouttime": "2014-06-25T21:59:59Z",
"template": false,
"partiescount": 2,
"type": "signable",
"process": "contract",
"authentication": "standard",
"delivery": "mixed",
"deliveryMethods": [
 "email",
 "pad"
  ],
 "anyinvitationundelivered": false,
"shared": false,
"file": "9222591556598841083",
"inpadqueue": false,
"deleted": false,
"reallydeleted": false,
"canperformsigning": false,
"isviewedbyauthor": false,
"objectversion": 44
  },
 "subfields": [
{
 "id": "235435435345345",
 "status": "signed",
 "name": "Maria 44444",
 "time": "2014-06-11T12:37:54Z",
 "invitationundelivered": false,
 "inpadqueue": false,
 "isauthor": false,
 "authentication": "standard",
 "delivery": "pad"
  }
 ],
 "link": "/d/43354654654654654",
 "isauthor": false,
 "docauthorcompanysameasuser": true
  },

Here is the JSON im getting. Even though this question has been asked before i cannot find an answer to get this to worrk.

Well, why target an index i.e. data.list[1]? Iterate over data.list — Johan
– Johan, Commented Jun 12, 2014 at 9:03

Sudharsan S · Accepted Answer · 2014-06-12 09:15:17Z

1

Use data.list instead of data.list[1]

$.getJSON('list.json', function(data) {
   $.each(data.list, function(i, f) {
      var tblRow = "<tr>" + "<td>" + f.title + "</td>" +
       "<td>" + f.status + "</td>" + "<td>" + f.party + "</td>" + "<td>" + f.author + "</td>" + "</tr>"
       $(tblRow).appendTo("#listdata tbody");
 });

});

edited Jun 12, 2014 at 9:15

answered Jun 12, 2014 at 9:06

Sudharsan S

15.4k4 gold badges34 silver badges51 bronze badges

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

1 Comment

user3171754 Over a year ago

This doesnt look into the fields object

Amin Jafari · Accepted Answer · 2014-06-15 07:55:37Z

0

try this:

var list = [];
$.getJSON('list.json', function(data) {
for(x=0;x<=data.list.length;x++){
     $.each(data.list[x], function(i, f) {
     var tblRow = "<tr>" + "<td>" + f.title + "</td>" +
     "<td>" + f.status + "</td>" + "<td>" + f.party + "</td>" + "<td>" + f.author + "</td>" + "</tr>"
     $(tblRow).appendTo("#listdata tbody");
   });
}

UPDATE:

var list = [];
$.getJSON('list.json', function(data) {
for(x=0;x<=data.list.length;x++){
     $(data.list[x]).first().load(function(i, f) {
     var tblRow = "<tr>" + "<td>" + f.title + "</td>" +
     "<td>" + f.status + "</td>" + "<td>" + f.party + "</td>" + "<td>" + f.author + "</td>" + "</tr>"
     $(tblRow).appendTo("#listdata tbody");
   });
}

edited Jun 15, 2014 at 7:55

answered Jun 12, 2014 at 9:07

Amin Jafari

7,2153 gold badges21 silver badges44 bronze badges

4 Comments

Sudharsan S Over a year ago

He wants only first object

Amin Jafari Over a year ago

No he does not: "I can only get this to find and show the first object. I need some help for how to loop this so i can get all results from JSON."

user3171754 Over a year ago

It worked great! Thank you! But in my html table i get result then 4 "undefined" rows then another result etc... @AminJafari

Amin Jafari Over a year ago

then you have to remove the .each function, check out my update

Collectives™ on Stack Overflow

loop over an array of objects with jquery?

2 Answers 2

1 Comment

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related