HTML is NULL in JSON object from json_encode

Question

I have a ajax call calling a php file who runs a long php function which returns a JSON encoded array/object. Now I need to send HTML also into the ajax response. I thought about sending the HTML inside the array.

Is that a good practise?

Right now I cannot get it working, I get a NULL as value for that property. Don't know why.

$statHTML = '<table>';
foreach ($toHTML as $key=>$value) {
    $statHTML.= '
        <tr class="'.$key.'">
            <td class="side">'.$value[0].'</td>
            <td>'.$value[2].' '.$value[1].'</td>
        </tr>';
}
$statHTML.= '</table>';
//  echo $statHTML;   // - this works
//function return   
$answer = array('mostSearched'=>$mostSearched,
                'timeOfDay' => $timeOfDay,
                'mostSearchedDays'=>$mostSearchedDays,
                'statHTML' => $statHTML                 
            );
return json_encode($answer);

The ajax response from the console before the JSON.parse():

{
    "mostSearched": {
        "title": "Most serached houses",
        "colNames": [21],
        "rowNames": [2013],
        "rows": [1]
    },
    "timeOfDay": {
        "title": "Time of search",
        "colNames": ["07:30"],
        "rowNames": ["07:30"],
        "rows": [
            [1]
        ]
    },
    "mostSearchedDays": {
        "title": "Most searched days",
        "colNames": ["2013-12-21", "2013-12-22", "2013-12-23", "2013-12-24", "2013-12-25", "2013-12-26", "2013-12-27"],
        "rowNames": ["2013-12-21", "2013-12-22", "2013-12-23", "2013-12-24", "2013-12-25", "2013-12-26", "2013-12-27"],
        "rows": [
            [1, 1, 1, 1, 1, 1, 1]
        ]
    },
    "statHTML": null
}

@MarkusKottländer, did not try that before. Did it now and got a JS error: `Uncaught SyntaxError: Unexpected token s ` in this line: `var object = JSON.parse(response);` — Rikard, Dec 25 '13 at 11:41
yes of course, i just meant to test the behavior of json_encode(). Call your php script directly for that. Also json_encode only works with utf8 encoding and i dont know the behavior with other encodings. — Markus Kottländer, Dec 25 '13 at 11:42
@MarkusKottländer, when I call the php directly I get String(487)... and the HTML is again `NULL`. The last part is `,"statHTML":null}"` — Rikard, Dec 25 '13 at 11:46
Try `json_encode(utf8_encode($answer));`. Looks like an encoding issue to me. — Markus Kottländer, Dec 25 '13 at 11:49
@MarkusKottländer a `var_dump()` on your suggestion returns: `string(4) "null"`... I have no other ideas myself... — Rikard, Dec 25 '13 at 11:52
Well sry, my fault. utf8_encode takes a string as argument not an array of course. So try `'statHTML' => utf8_encode($statHTML);` in your array definition. — Markus Kottländer, Dec 25 '13 at 11:54
@MarkusKottländer, that did it! nice! I wait for your answer also. Thanks! — Rikard, Dec 25 '13 at 11:56
Maybe you should consider to mark it as correct one or tag your post as duplicate of http://stackoverflow.com/questions/1972006/json-encode-is-returning-null ;) — Markus Kottländer, Dec 25 '13 at 12:24

score 8 · Accepted Answer · answered Dec 25 '13 at 11:58

From php.net:

Parameters

value

The value being encoded. Can be any type except a resource.

All string data must be UTF-8 encoded.

So use:

$answer = array('mostSearched'=>$mostSearched,
        'timeOfDay' => $timeOfDay,
        'mostSearchedDays'=>$mostSearchedDays,
        'statHTML' => utf8_encode($statHTML)
);

return json_encode($answer);

score 1 · Answer 2 · answered Dec 25 '13 at 11:37

Most likely the build-in JSON parser used by PHP cannot properly parse the HTML, the easiest way to solve the issue is to base64 encode the html on the server, and then decode it on the client, using either the newer atob and btoa base64 methods, or one of the many polyfills out there.

score 0 · Answer 3 · answered Dec 25 '13 at 11:56

use base64_enccode in this at the time of conversion

$answer = array('statHTML'=>base64_encode('<h1>html in here</h1>'));
echo json_encode($answer);exit;

And at the time of getting response from ajax

atob(response.statHTML);

Hope you understand how it works

HTML is NULL in JSON object from json_encode

3 Answers3