Question

I have a an array that has been json encoded from php

The array looks like this(called $jsonGraphData;):

[{"Type":"Category","Name":"games","TotalClicks":"162"},{"Type":"Category","Name":"apps","TotalClicks":"29"},{"Type":"Category","Name":"music","TotalClicks":"28"},{"Type":"Category","Name":"video","TotalClicks":"25"}]

I would like to use the array values in a loop within a jquery function that generates a graph. These are the hard coded values that allows the graph to work:

series: [{
                name: 'games',
                data: [162]

            }, {
                name: 'apps',
                data: [29]

            }, {
                name: 'video',
                data: [25]

            }]

What I would like to do is to use jquery ‘each’ to loop through the array so that defining the series is dynamic this is what I am trying to achieve:

var totalClicks = $jsonGraphData; (this is the array, the alert works fine).

series: [{
  $.each(totalClicks, function(index, val) {
    alert('name: ' + val.Name + ' ' + 'data: ' + val.TotalClicks);
    //here is where I need the format to be the same as the example above.
  });   
}]

I lack the knowledge of jquery syntax to achieve this and do not know what to search for on Google.

Answer 1

Try this code

var series = [];
  $.each(totalClicks, function(index, val) {
    series.push({name: val.Name, data: val.TotalClicks});
  });   

Or if data should still be an array with only one value in it.

var totalClicks = [{ "Type": "Category", "Name": "games", "TotalClicks": "162" }, { "Type": "Category", "Name": "apps", "TotalClicks": "29" }, { "Type": "Category", "Name": "music", "TotalClicks": "28" }, { "Type": "Category", "Name": "video", "TotalClicks": "25"}]

var series = [];
$(totalClicks).each(function (index, val) {
    series.push({ "name": val.Name, "data": [val.TotalClicks] });
});