WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I have the following JSON array:

[{"occurences":"1","post_title":"Test 1","ID":"16"},    
 {"occurences":"1","post_title":"Test 2","ID":"19"},

And I use this js to parse and print it:

     $.each(data, function(i, post){
     content = '';
     content += '<li>' + post.post_title + '</li>';



But the display only showed "Undefined", and the Console showed no errors.

In case you ask, this is the HTML part:

<form id="search" action="">
<div class="toolbar">
    <a href="#" class="back">Back</a>
<ul class="rounded">
    <li><input type="text" name="search-text" placeholder="Search" id="search-text" /></li>
<ul class="edgetoedge" id="search-results">
    <li class="sep">Results</li>                

Any clue why? Many thanks in advance!

share|improve this question

closed as too localized by toscho Nov 24 '12 at 17:12

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center.If this question can be reworded to fit the rules in the help center, please edit the question.

Setting the proper dataType for the request is an important detail not considered in the answer above (this causes jQuery to send a HTTP Accept header with the request - and it will be expecting JSON data in the success callback as well):

dataType: 'json',
   var content = '';
   jQuery.each(json, function(i, v){
      content += '<li>' + v.post_title + '</li>';
   /* like this the results won't cummulate */

And sending the proper HTTP header with the response was also not considered:

header("content-type: application/json; charset=utf8");

Internet Exploder doesn't like that header - but this is another story (read more).

share|improve this answer
up vote 0 down vote accepted

                  url: 'http://mypath/wp-admin/admin-ajax.php',

                       'queryString': $.trim(inputString.val())

                  dataType: 'JSON',

                            // this part is what happens with the JSON data


                            var content = '';
                            var data = $.parseJSON(data);

                            $.each(data, function(i, post) {
                                content += '<li>' + post.post_title + '</li>';


                    error: function(errorThrown){

share|improve this answer
@syslogic, thank you for taking the time. I paste in the above the entire snippet of Ajax I have used all along. While you've probably got a point on the "parseJSON" being useless, I got null errors when it was left out. I'm still pondering on the issue. – Josef Young Aug 18 '12 at 10:37
The puzzle solved. I have tested and tested. I found this: there is absolutely no need for parsing data passed by Ajax, except that there is a conflict between the client-side jQuery and the server-side jQuery versions! – Josef Young Aug 19 '12 at 17:00
  1. Add var json = jQuery.parseJSON(data);
  2. Define content by adding var content
  3. Place content = ''; before the each-loop

Like this:

function (data) {
    var content = '';
    var json = jQuery.parseJSON(data);

    $.each(json, function(i, post) {
        content += '<li>' + post.post_title + '</li>';

share|improve this answer
Thanks. Have tried your suggestions, but the problem persisted. – Josef Young Aug 14 '12 at 15:32
Although the #2 must have been right. – Josef Young Aug 14 '12 at 15:33
Sorry, retried and got it work. – Josef Young Aug 14 '12 at 15:41
You got it right except that my ftp server was being down. Sorry and thanks!!! – Josef Young Aug 14 '12 at 15:42
Erm ... jQuery.parseJSON(data) is pretty useless - because variable "data" already should be a JS object in the callback of the jQuery.ajax function... this would only apply if it's a JSON-string. I rather assume you send out the JSON without or with wrong HTTP headers. – syslogic Aug 17 '12 at 21:50

Not the answer you're looking for? Browse other questions tagged or ask your own question.