JavaScript: Decode a PHP json_encode response

Question

For example, I am json_encoding my array and outputting it:

$key = $this->key;
                    $sql = "SELECT * FROM Requests";                   
                    $result = $this->db->query($sql);
                    $temp = array();
                    foreach($result as $r)
                    {
                        if($r['key'] == $key){
                        array_push($temp, array(
                            'song' => $r['song'],
                            'artist' => $r['artist'],
                            'by' => $r['by']
                        ));
                        }
                    }
                    $this->encoded = json_encode($temp);
                    echo $this->encoded;

Then, I am sending a GET request to it:

$.get('http://www.example.com/file.php')
                .done(function(data){
                    alert(data['artist']);
                });

However, this alerts:

undefined

Can anyone possibly help me? I've searched a lot and tried a lot but nothing seems to be working (like, JSON.Parse).

Edit: I tried adding the header('Content-Type: application/json'); but it leaves me with this error:

TypeError: data is null

Thanks in advance!

$.get('http://www.syncsapi.x10host.com/API/Public/', {
  start: 'example'
})
$.get('http://www.syncsapi.x10host.com/API/Public/', {
    display: '5'
  })
  .done(function(data) {
    console.log(data[0]);
  });
});

<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

Possible duplicate of [Returning JSON from a PHP Script](http://stackoverflow.com/questions/4064444/returning-json-from-a-php-script) — Sammitch, Mar 17 '16 at 00:48
that is the exact output, but when i `echo "test";` it works because `data` is set as "test" :/ just, when i echo the `json_encoded` or `array`, the `data` is undefined or null — Jaquarh, Mar 17 '16 at 01:08
No the output of your PHP script, as your webserver emits it. Not the output of your javascript. — Evert, Mar 17 '16 at 01:09
its " " - I already did this but if I `echo "test";` when i log data, its test — Jaquarh, Mar 17 '16 at 01:09
@Evert: i'm sure it's not, or else `alert(data['param'])` would throw instead of showing `undefined` — dandavis, Mar 17 '16 at 01:11
Ok that's a problem Kyle. Your object is wrapped in an array. The PHP script you're sharing is not the complete PHP script. — Evert, Mar 17 '16 at 01:11
This is the issue with sharing code samples that are not representative of your actual problem. What you're sharing here should just work, but your real code is different enough for it to break. — Evert, Mar 17 '16 at 01:12
So next time you ask a question, it's still a good idea to simplify your code for stack overflow, but make sure you test to see if you can reproduce the issue with the simplified code sample. — Evert, Mar 17 '16 at 01:13
this outputs: [{"song":"Body Bag Season","artist":"Don Dyno","by":"Kyle"}] — Jaquarh, Mar 17 '16 at 01:13
thanks @Evert - sorry about that, just hate sticking database code into shared places x) — Jaquarh, Mar 17 '16 at 01:15
Actually, also share your js code to reproduce this real problem. Because it doesn't match the php anymore. There's no `param` — Evert, Mar 17 '16 at 01:15

score 4 · Accepted Answer · answered Mar 17 '16 at 01:19

4

So the problem with your script is that you are basically emitting something like this:

[
  {
    "song"   : "...",
    "artist" : "..."
  }
]

But your javascript code is expecting something like this:

{
  "song"   : "...",
  "artist" : "..."
}

If your intention was to only ever send back one song for that PHP service, you should modify your PHP service to remove the top-level array.

However, if you intend to send back more than 1 song, then the data you returned makes sense, but your javascript does not. To fix your javascript, you could simply change:

alert(data['artist']);

into:

alert(data[0].artist);

Note that .artist and ['artist'] is the same, the real difference in my sample is that I added [0] which grabs the first item in the top-level array.

answered Mar 17 '16 at 01:19

Evert

93,428
18
118
189

with the header mentioned below: error - `TypeError: data is null` without it: error - `data[0] is undefined` :/ – Jaquarh Mar 17 '16 at 01:21
@KyleE4K I'm thinking then there might still be something wrong with your php script. Is it possible at all to send the url so I can take a look? – Evert Mar 17 '16 at 01:27
`$.get('http://www.syncsapi.x10host.com/API/Public/', { display: '5' }) .done(function(data){ console.log(data[0]); alert(data[0].artist); });` – Jaquarh Mar 17 '16 at 01:29
Awesome. Interestingly your PHP script emits nothing! Empty string. – Evert Mar 17 '16 at 01:32
Verify by just opening http://www.syncsapi.x10host.com/API/Public/?display=5 in a browser. – Evert Mar 17 '16 at 01:33
I did, i changed it to a string but im changing it back to the array now. (note that i am cross domain referencing using cors - I am just really bad with JavaScript) – Jaquarh Mar 17 '16 at 01:35
if you run http://syncsapi.x10host.com/API/Public/?display=5 i browser now, you'll get the result @Evert – Jaquarh Mar 17 '16 at 01:36
Still nothing @KyleE4K – Evert Mar 17 '16 at 01:39
I am receiving this: `[{"song":"Body Bag Season","artist":"Don Dyno","by":"Kyle"}]` when i directly access that link through browser, if you're doing so by code, you have to send a request before which integrates your `key`, use example – Jaquarh Mar 17 '16 at 01:40
I don't. Also not when trying it on the command line with curl: `curl -v http://syncsapi.x10host.com/API/Public/?display=5` yields nothing and 'Content-Length: 0` – Evert Mar 17 '16 at 01:40
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/106525/discussion-between-evert-and-kyle-e4k). – Evert Mar 17 '16 at 01:41

JavaScript: Decode a PHP json_encode response

1 Answers1