Loop through array and associated elements

Question

I have the following JSON data:

0:[{"LoggerId":"1000651443","ReadingDate":"2018-12-05 00:03:03, "ReadingValue":"12.6", "Tooltip":"Someinfo"},
{"LoggerId":"1000651447","ReadingDate":"2018-12-05 00:04:03, "ReadingValue":"12.7", "Tooltip":"Someinfo"}]

1:[{"LoggerId":"1000651444","ReadingDate":"2018-12-05 00:03:05, "ReadingValue":"12.9", "Tooltip":"Someinfo"},
 {"LoggerId":"1000651445","ReadingDate":"2018-12-05 00:03:07, "ReadingValue":"14.9", "Tooltip":"Someinfo"}]

2:[{"LoggerId":"1000651446","ReadingDate":"2018-12-05 00:03:17, "ReadingValue":"13.6", "Tooltip":"Someinfo"},
 {"LoggerId":"1000651446","ReadingDate":"2018-12-05 00:04:17, "ReadingValue":"43.6", "Tooltip":"Someinfo"}]

I want to be able to loop through each array and all of its elements.

So far I can only loop through main array and not its contents.

  success: function (d) {
            var parsedData = $.parseJSON(d);                
            var objCount = Object.keys(parsedData).length;
            $.each(parsedData, function (key, value) {
                console.log[value.LoggerId, new Date(value.ReadingDate), Number(value.ReadingValue), value.ToolTip]
            }); 
   },

I have tried some nested loops, but I get object undefined as an error.

I want to loop through 0 and all of its elements and assign them, then 1, then 2 and so on...

TIA

"ReadingDate":"2018-12-05 00:03:05 There is no closing quote — Googlian
– Googlian, Commented Feb 2, 2019 at 19:13
fix up the JSON and console.log( - not console.log[ - It looks ok to me — David Bray
– David Bray, Commented Feb 2, 2019 at 21:31

Googlian · Accepted Answer · 2019-02-02 20:21:13Z

1

If you receive json array respose then you can loop through each method in jQuery

var data = [
	[{
		"LoggerId": "1000651443",
		"ReadingDate": "2018-12-05 00:03:03",
		"ReadingValue": "12.6",
		"Tooltip": "Someinfo"
	}],
	[{
		"LoggerId": "1000651444",
		"ReadingDate": "2018-12-05 00:03:05",
		"ReadingValue": "12.9",
		"Tooltip": "Someinfo"
	}],
	[{
		"LoggerId": "1000651446",
		"ReadingDate": "2018-12-05 00:03:17",
		"ReadingValue": "13.6",
		"Tooltip": "Someinfo"
	}]
];

$.each(data, function(i, item) {
    console.log(item[0].LoggerId);
    $("#res").append(item[0].LoggerId + "<br>");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="res"></div>

If you have bunch of data in your json file then try get method

$.get("https://jsonstorage.net/api/items/344a6593-6ee4-45b2-a85c-227f76e32880", function(data, status){
    $.each(data, function(i, item) {
        console.log(item.LoggerId);
        $("#res").append(item.LoggerId + "<br>");
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="res"></div>

edited Feb 2, 2019 at 20:21

answered Feb 2, 2019 at 19:18

Googlian

6,8853 gold badges44 silver badges49 bronze badges

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

9 Comments

The OrangeGoblin Over a year ago

I have added to the question, but there are many rows in each array (about 8500)...So I need to loop through each array then the elements within.

Googlian Over a year ago

You can show your exact json output then I can suggest the way

The OrangeGoblin Over a year ago

You might regret asking me that, here you go, jsfiddle.net/xthr35sy

The OrangeGoblin Over a year ago

How it works is I have a in this instance 10 devices, that I retireve data for and this is data ouput from them in Json. I then need to add them to a chart as seperate series, hence the looping.

The OrangeGoblin Over a year ago

It will only let me add about three lots of data in Fiddle

|

gaetanoM · Accepted Answer · 2019-02-02 21:18:31Z

1

Your main issue is in this line:

$.each(parsedData, function (key, value) {

You have an array of arrays of object: that means you need to use value[0] instead of value.

You may continue to use the format value.LoggerId.... if you flat your array:

$.each(parsedData.flat(), function (key, value) {

The snippet:

var parsedData = [[{
    "LoggerId": "1000651443",
    "ReadingDate": "2018-12-05 00:03:03",
    "ReadingValue": "12.6",
    "Tooltip": "Someinfo"
}],
    [{
        "LoggerId": "1000651444",
        "ReadingDate": "2018-12-05 00:03:05",
        "ReadingValue": "12.9",
        "Tooltip": "Someinfo"
    }],
    [{
        "LoggerId": "1000651446",
        "ReadingDate": "2018-12-05 00:03:17",
        "ReadingValue": "13.6",
        "Tooltip": "Someinfo"
    }]] ;


//
// first solution
//
$.each(parsedData, function (key, value) {
    console.log(value[0].LoggerId, new Date(value[0].ReadingDate), Number(value[0].ReadingValue), value[0].Tooltip)
});

console.log('-----------------------------');
//
// second solution with array.flat
//
$.each(parsedData.flat(), function (key, value) {
    console.log(value.LoggerId, new Date(value.ReadingDate), Number(value.ReadingValue), value.Tooltip)
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

According to your last comment:

Each array [{a,b,c,d}] is unique to a device, so 0:[{a,b,c,d}] and 1:[{a,b,c,d}] are two different sets of data. So I need to loop through the indexes ([0],1,[2],[3] etc) and then elements inside them {a,b,c,d}

a simple solution can be a double for:

var arr = [[1,2,3], [4,5,6], [7,8,9]];

for(var i=0; i< arr.length; i++) {
    console.log('sub array N. ' + i);
    for(var j=0; j<arr[i].length; j++) {
        console.log('element n. ' + j + ': ' + arr[i][j]);
    }
}

edited Feb 2, 2019 at 21:18

answered Feb 2, 2019 at 19:19

gaetanoM

42.1k6 gold badges45 silver badges63 bronze badges

5 Comments

The OrangeGoblin Over a year ago

What I get at the moment is (4) [undefined, Invalid Date, NaN, undefined]. I assume this is because I need to loop through the array elements (0,1,2 etc.) and nest a loop to get the elements

The OrangeGoblin Over a year ago

Each array [{a,b,c,d}] is unique to a device, so 0:[{a,b,c,d}] and 1:[{a,b,c,d}] are two different sets of data. So I need to loop through the indexes ([0],[1],[2],[3] etc) and then elements inside them {a,b,c,d}.

gaetanoM Over a year ago

Exactly what the snippet does

The OrangeGoblin Over a year ago

I noticed in my JSON, that the arrays are completely separate (no comma). So I loop through the arrays successfully, but I cannot get it to loop through the keys/values as it sees the array as one giant string. So I tried $.each(parsedData, function (key, value) { $.each(value, function (i, item) { console.log(item.LoggerId); }); });

The OrangeGoblin Over a year ago

Also that wont write the loggerId or any other key/value pair.

The OrangeGoblin · Accepted Answer · 2019-02-03 13:09:12Z

0

The following worked for me:

            success: function (d) {               
                var parsedData = $.parseJSON(d);
                $.each(parsedData, function (key, value) {  
                    var result = $.parseJSON(value);  
                    $.each(result, function (k, v) {
                        //display the key and value pair
                        console.log([new Date(v.ReadingDate), Number(v.ReadingValue)]);
                    });

                });   
            },

I was able to loop through the arrays and then the contents of the keys. Once I parsed the JSON data from the individual arrays, it seemed to work.

answered Feb 3, 2019 at 13:09

The OrangeGoblin

7942 gold badges8 silver badges32 bronze badges

Collectives™ on Stack Overflow

Loop through array and associated elements

3 Answers 3

9 Comments

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

9 Comments

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related