user3041237
user3041237

Reputation: 41

Unable to parse Multiple json Array on Javascript

I am working on the webservice part of my critical application, i have a json file that is valid, which is having multiple arrays, i am unable to parse it, below is the file,

{
   "Account": "xxx",
   "DeviceList": [
      {
         "Device": "yyy",
         "Device_desc": "xyz",
         "EventData": [
            {

               "GPSPoint": "12.92178,74.90599",
               "GPSPoint_lat": 12.92178,
               "GPSPoint_lon": 74.90599


            }
         ]
      }
   ]
}

I tried with the below code but it is showing blank screen in the browser, Please help me to solve this issue,

<script>
var xmlhttp = new XMLHttpRequest();
var url = "xyz.com";//its my url

xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        myFunction(xmlhttp.responseText);
    }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();

function myFunction(response) {
    var arr = JSON.parse(response);
    var text = "";

    var i=0;
 for (i = 0; i < arr.DeviceList.EventData.length; i++) {
    text += arr.DeviceList.EventData.GPSPoint + "<br>";
}

document.getElementById("id01").innerHTML = text;



}
</script>

Using the above code I need to display only GPSPoint values, but I am unable to solve this issue.

Please help me to resolve.

Upvotes: 0

Views: 70

Answers (4)

manoj
manoj

Reputation: 3761

The problem is because the arrays are not given proper index, to solve this you can either use the index 0 for outer and i for inner , if you are sure that there will always be only one element.

best case, iterate the outer array as well

for (var j = 0; i < arr.DeviceList.length; j++) {
    for (var i = 0; i < arr.DeviceList[j].EventData.length; i++) {
        text += arr.DeviceList[j].EventData[i].GPSPoint + "<br>";
    }
}

Upvotes: 0

Vijay Mistry
Vijay Mistry

Reputation: 157

Try this

<script>
var xmlhttp = new XMLHttpRequest();
var url = "xyz.com";//its my url

xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        myFunction(xmlhttp.responseText);
    }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();

function myFunction(response) {
    var arr = JSON.parse(response);
    var text = "";

    var i=0;
 for (j = 0; i < arr.DeviceList.length; j++) {
 for (i = 0; i < arr.DeviceList[j].EventData.length; i++) {
    text += arr.DeviceList[j].EventData[i].GPSPoint + "<br>";
}
 }

document.getElementById("id01").innerHTML = text;



}
</script>

Upvotes: 0

sahil gupta
sahil gupta

Reputation: 2349

The issue with

for (i = 0; i < arr.DeviceList.EventData.length; i++) {
text += arr.DeviceList.EventData.GPSPoint + "<br>";

}

is that the arr.Device is an array

You can use

for (i = 0; i < arr.DeviceList[0].EventData.length; i++) {
text += arr.DeviceList[0].EventData[i].GPSPoint + "<br>";

}

Upvotes: 0

Florian Wendelborn
Florian Wendelborn

Reputation: 1747

You're accessing the arrays wrong. Even if the array only has 1 element, you still need to specify an index for it to correctly iterate through your object.

Try something like this:

for (i = 0; i < arr.DeviceList[0].EventData.length; i++) {
    console.log(arr.DeviceList[0].EventData[i].GPSPoint);
}

Upvotes: 1

Related Questions