Question

160

Iterate Json Data in JavaScript/TypeScript

rated 0 times [ 166] [ 6] / answers: 1 / hits: 19893 / 7 Years ago, wed, february 22, 2017, 12:00:00

I need to Iterate on this Json Data and add value to the Grid in JavaScript(TypeScript) No Jquery.

{GridHeader:{Id:Id,Name:Full Name,Age:Age},GridData:{Id:3,name:Vu,age:34}}

I have the Add function as follows which add header and Data to the Grid:

 let header = '{GridHeader:{Id:Id,Name:Full Name,Age:Age},GridData:{Id:3,name:Vu,age:34}}';

let myheader = JSON.parse(header);





for (var i = 0; ??) {

   ....



    AddRecord(headerdata, i);

}

This is where I am adding it to the Grid:

function AddRecord(record, n) {

var detail = document.getElementById(detail);

var header = document.getElementById(header);



if (n == 0) {

    var newdiv = document.createElement(div);

    newdiv.innerHTML = <div style=''> + record.id + </div> + <div> + record.name + </div> + <div> + record.age + </div>;

}



var newdiv = document.createElement(div);

newdiv.innerHTML = <div style=''> + record.id + </div> + <div> + record.name + </div> + <div> + record.age + </div>;

detail.appendChild(newdiv);

}

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

micayla

Add To Favorites

Follow

Total Points: 148

Total Questions: 92

Total Answers: 109

Location: Aruba

Member since Sat, Oct 2, 2021

3 Years ago

answered 7 Years ago johnnyblaynes · Accepted Answer

Your going to have to explain in more detail what you mean by iterate on the data.

{

   GridHeader:{

      Id:Id,

      Name:Full Name,

      Age:Age

   },

   GridData:{

      Id:3,

      name:Vu,

      age:34

   }

}

Does not have any Arrays present in it.

If it did have arrays in it, then I'm going to assume you meant something like this:

mydata:{

   GridHeader:{

      Id:Id,

      Name:Full Name,

      Age:Age

   },

   GridData:[

        {

          Id:3,

          name:Vu,

          age:34

        },

        {

          Id:2,

          name:Vu2,

          age:33

        },

        {

          Id:1,

          name:Vu1,

          age:32

        }

   ] 

}

If your data looks like that, then you have an array of objects in your grid data, and you would then be able to use something like this:

mydata.GridData.forEach(item){

  // DO something with

  // item.Id

  // item.Name

  // item.Age

}

Within the loop your code will get called once for each object in the GridData part of your parent and allow you access to each of the 3 properties for each individual item.

However, looking at your data the way it is, then it's just a simple object.

If we imagine you have it in a variable called myData, then you can access it's parts as follows:

myData.GridHeader.Id

myData.GridHeader.Name

myData.GridHeader.Age

To get the header properties.

myData.GridData.Id

myData.GridData.Name

myData.GridData.Age

To get at the properties of the one and only non iterable object you have present.