json_encode and getJSON

Question

I am using PHP at server side to get json formatted output as below. At client side I use jQuery to display the results but it displays null. Please let me know where I went wrong. Any help is appreciated.

PHP

while ($r = mysql_fetch_assoc($result))
{
    $rows[] = $r;
}
echo json_encode($rows);

Output

[
    {
        "a_name": "affles",
        "bname": "bua",
        "c_number": "10101010",
        "dateandtime": "2013-11-30 17:50:04"
    },
    {
        "a_name": "affles",
        "bname": "bua",
        "c_number": "10101010",
        "dateandtime": "2013-11-30 17:50:04"
    },
    {
        "a_name": "anan",
        "bname": "nesh",
        "c_number": "2017439441",
        "dateandtime": "2013-12-04 17:50:04"
    }
]

Client side

$.getJSON("http://apip.com/results.php", function (data) {
    $.each(data, function (index, value) {
        $('<li>' + value.a_name + '</li>').appendTo('#groups');
    });
});

Client side code using JSONP: I modified client side to use JSONP but still it returns null. An help is appreciatd

<script>
(function() {
  var flickerAPI = "http://apip.com/results.php?jsoncallback=?";
  $.getJSON( flickerAPI, 
    (function( data ) {
      $.each( data.items, function( index, value ) {

$('<li>' + value.a_name + '</li>').appendTo('#groups');

      });
    });
})();
</script>

Are you sure your `echo json_encode()` is the _only_ output sent as a response to the request? _no_ content before or after it? — Wrikken, Dec 17 '13 at 00:22
Never a good idea to use a complete and absolute URI in an AJAX request. You're bound to run into *same-origin-policy* issues. Simply use `/results.php` — Phil, Dec 17 '13 at 00:22
@Phil: I have to use absolute URL. PHP code resides in web server while my front end is mobile app. Is there anyway to overcome this? — user3050862, Dec 17 '13 at 04:49
@user3050862 Then you cannot simply use `getJSON` without some extra tweaks. See http://stackoverflow.com/questions/3076414/ways-to-circumvent-the-same-origin-policy — Phil, Dec 17 '13 at 04:57
Thanks Phil. With the little knowledge I have on JSONP, I tweaked the client side code as below but still it returns null. Is there anything wrong with below code? Any help is appreciated `` — user3050862, Dec 18 '13 at 12:30
Any help is appreciated...I tried using JSONP as in above code but still it displays null...Please let me know where I am going wrong — user3050862, Dec 20 '13 at 21:08

score 1 · Answer 1 · answered Dec 17 '13 at 00:23

1

As you can see from this fiddle, it is working fine. What I do suspect is going wrong is that you're using http://apip.com/results.php and you might be fooling jQuery into thinking you're doing a cross-domain request (which you might be doing), which is generally prohibited by browsers unless you use JSONP. If you own http://apip.com/, use

$.getJSON("/results.php", function (data) {
    $.each(data, function (index, value) {
        $('<li>' + value.a_name + '</li>').appendTo('#groups');
    });
});

answered Dec 17 '13 at 00:23

Kevin Pei

5,800
7
38
55

@Phil good eye there. I forgot that it was outputting list items. Thanks :) – Kevin Pei Dec 17 '13 at 00:28
2

I also used `.text()` for the `
` contents as it's safer (encodes entities). You were also already in the *document ready* handler (as selected on the left)

Phil

Dec 17 '13 at 00:29

@KevinPei:I have to use complete URL as PHP code resides in web server whereas my front end is mobile app. Can you please elaborate on how to use JSONP? – user3050862 Dec 17 '13 at 04:51

@user3050862 there's a good answer for that here: http://stackoverflow.com/questions/2067472/what-is-jsonp-all-about – Kevin Pei Dec 17 '13 at 20:31

json_encode and getJSON

1 Answers1