How do I iterate over a JSON array using jQuery/AJAX call from PHP?

Question

Possible Duplicate:
Loop through Json object

I have a PHP function, data.php, which fetches JSON data from an external server URL like such:

<?php
$url = "https://dev.externalserver.net/directory";
$content = file_get_contents($url);
echo json_encode($content);
?>

The JSON array retrieved looks like the following:

[ 
   { "name": "Not configured", 
     "mac_address": "1111c11c1111", 
     "online": "false", 
     "rate": "Not configured" },

   { "name": "Not configured", 
     "mac_address": "0000c00c0000", 
     "online": "false", 
     "rate": "Not configured" } 
]

I'm now trying to write an AJAX call to that PHP function, iterate through the JSON array, and display it in the browser in non-JSON formatting. My AJAX code looks like the following:

$.ajax({ url: 'data.php',
         type: 'POST',
         dataType: 'json',
         success: function(output) {            
            $.each(output, function() { 
                $.each(this, function(key, value){
                    alert(key + " --> " + value); 
                });
            });
                                   }
});

My issue is that code is currently displaying alert boxes that show the individual characters within the array like such: 0 --> [ , 0 --> , 0 --> { ... etc etc

Is there a problem with how I'm passing the data using json_encode(); and dataType: 'json' or does the issue resolve with how I'm iterating through the array?

Thanks.

if the file contents at "https://dev.externalserver.net/directory" contain a JSON encoded string, why not just have your ajax get the string directly from that link instead of making an extra trip back to your server? — dqhendricks, Jun 24 '11 at 20:40

keekerdc · Accepted Answer · 2011-06-24T23:54:49.703

7

Other responders missed the sneaky but still obvious bit, that what's coming back from the resource being polled in the PHP is probably already valid JSON, and re-encoding it is causing the browser to interpret it merely as a string. In this case, the javascript never had a chance.

Remove the json_encode() bit in the PHP and just echo what comes back, and see if that doesn't improve things.

edited Jun 24 '11 at 23:54

answered Jun 24 '11 at 20:37

keekerdc

144
3

score 2 · Answer 2 · answered Jun 24 '11 at 18:49

2

I think your problem is the this in the second each. Try:

$.each(output, function(key, value) { 
    $.each(value, function(key, value){
        alert(key + " --> " + value); 
    });
});

answered Jun 24 '11 at 18:49

Chris Pratt

232,153
36
385
444

This seemed to produce the same result in my output. – Ted Jun 24 '11 at 19:04

score 1 · Answer 3 · answered Jun 24 '11 at 19:21

1

var jsonArray = [ 
     { "name": "Not configured", 
         "mac_address": "1111c11c1111", 
         "online": "false", 
         "rate": "Not configured" },

       { "name": "Not configured", 
         "mac_address": "0000c00c0000", 
         "online": "false", 
         "rate": "Not configured" } 
    ];

    $.each(jsonArray, function() {
      for (var key in this) {
        if (this.hasOwnProperty(key)) {
          console.log(key + " -> " + this[key]);
        }
      }
    });

answered Jun 24 '11 at 19:21

Jordan Brown

13,603
6
30
29

This code seems to work in the example you showed above, however, when I try to implement the jQuery into the AJAX it continues to throw out '0 --> [' , '0 -->' , '0 --> {' to the console instead of the correct data. It's almost like the AJAX function isn't reading the array properly when its received from the PHP. Is there a problem with my PHP/AJAX using json_encode and dataType:'json'? – Ted Jun 24 '11 at 19:34
Two things: try adding header('Content-type: application/json'); to your PHP. Also, what does the data look like when you console.log(output)? – Jordan Brown Jun 24 '11 at 20:37

score 0 · Answer 4 · edited May 23 '17 at 11:45

0

take a look at this

How do I loop through or enumerate a JavaScript object?

edited May 23 '17 at 11:45

Community

1
1

answered Jun 24 '11 at 19:00

Ascherer

8,223
3
42
60

How would such a loop work when I have multiple elements within multiple objects within a single array like I showed above? – Ted Jun 24 '11 at 19:05

How do I iterate over a JSON array using jQuery/AJAX call from PHP?

4 Answers4

Linked