How to loop through JSON object together with an if-statement?

Question

This is the JSON object:

{
    "temperatures": {
        "city": [{
            "name": "Riyadh",
            "high": [35, 38, 32]
        }, {
            "name": "New York",
            "high": [28, 36]
        }, {
            "name": "Dubai",
            "high": [18, 20]
        }]
    }
}

On page load I get the object via AJAX. I need to loop through each city and get the name of the city and the high array as well.

This is the page code:

<html>

    <head>
        <title>the title</title>

        <script type="text/javascript" src="tempj.js"></script>
        <script type="text/javascript">
        $(document).ready(function() {

            $.getJSON('temp.json', function(data) {
                alert('<ul><li>'+ jd.city.name +':'  + jd.high + '</ul> ');
            });
        });
        </script>

    </head>

    <body>
    </body>

</html>

stackoverflow.com/questions/1078118/… and stackoverflow.com/questions/2342371/… might help u — run
– run, Commented Nov 4, 2011 at 5:48

nnnnnn · Accepted Answer · 2011-11-04 05:52:50Z

I don't know what you mean in your question title about using an if statement, so I'm ignoring that.

Within your JSON, data.temperatures.city is an array of objects each of which has two properties, one for the city name and one an array of highs. I have no idea how you want to handle the fact that the highs arrays have different lengths, so I've just used the .join() method to form them into a comma-separated string on the end of the message in the alert.

Presumably you don't really want to pop up a bunch of alerts, but at least that's a starting place to see that you're getting the data you expect so the following should be enough to get you going:

$.getJSON('temp.json', function(data) {
   for (var i = 0; i < data.temperatures.city.length; i++) {
      alert("The temperatures in " + data.temperatures.city[i].name + " are "
            + data.temperatures.city[i].high.join(","));
   }
});

I deliberately didn't use $.each() so that for learning purposes you can see what's going on. Obviously you can convert this to use $.each() if you prefer.

You should add error checking that the properties you are trying to use actually exist (i.e., that the JSON is in the expected format).

jfriend00 · Accepted Answer · 2011-11-04 06:01:49Z

1

You can reach into the data to get to the city array and then loop through the city array to get the properties of each element in that array like this:

var data = {
    "temperatures": {
        "city": [{
            "name": "Riyadh",
            "high": [35, 38, 32]
        }, {
            "name": "New York",
            "high": [28, 36]
        }, {
            "name": "Dubai",
            "high": [18, 20]
        }]
    }
}

var cityArray = data.temperatures.city;
for (var i = 0; i < cityArray.length; i++) {
    // cityArray[i].name   (name of city)
    // cityArray[i].high   (array of high values for that city)
}

edited Nov 4, 2011 at 6:01

answered Nov 4, 2011 at 5:53

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

Comments

jfriend00 · Accepted Answer · 2011-11-04 05:51:12Z

0

if you are using jQuery you can loop through the json elements as

jQuery.getJSON('js/jsonTest.js',function(data) {
    $.each(data, function(key, val) {
        if (key == 'general') { 
            // code here
        } 
     }
}

edited Nov 4, 2011 at 5:51

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

answered Nov 4, 2011 at 5:37

sushil bharwani

30.2k30 gold badges98 silver badges130 bronze badges

2 Comments

proR Over a year ago

thanks alot but I want the name of each city and the high display,, the parameter of val and key refers to what ?

ElHacker Over a year ago

the val parameter refers to the actual value of the variables inside your JSON object, and the key refers to the index of that value inside your JSON object

Collectives™ on Stack Overflow

How to loop through JSON object together with an if-statement?

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related