jQuery post with JSON response

Question

I have this jQuery code which use $.post for Ajax:

$.post(ajax_url , { upload_id: upload_id },
function (response) {
    console.log(response);
    console.log(jQuery.type(response));
}, "json");

and the php code :

$data = Array(
'status' => '1',
'msg' => '',
'progress' => '0.24',
'time' =>'<span class="text-white">06:51</span> left (at 21KB/sec)',
'size' => '<span class="text-white">26KB</span> / 10.91MB (0.24%)');

echo json_encode($data);
die();

and it suppose the console print the json code and the type which is json.
the problem is not print any thing in the console, it means no response.

I put this in the Ajax code to see the error:

.fail( function(jqXHR, textStatus, errorThrown) {
alert(textStatus)});

and the alert was parsererror.

what is the problem ?

UPDATE

If I removed "json" from the ajax code, the response print the type string and the code {"status":1,"msg":"","progress":"0.15","time":"<span class=\"text-white\">11:11<\/span> left (at 10KB\/sec)","size":"<span class=\"text-white\">16KB<\/span> \/ 10.91MB (0.15%)"}

I need it json

is ajax_url valid?, what is upload_id? (works on my machine) — Sam Segers, Jan 02 '16 at 12:09
The reason why this parserror message occurs is that when you simply return a string or another value, it is not really Json, so the parser fails when parsing it. — Shameem Ahmed Mulla, Jan 02 '16 at 12:09
http://stackoverflow.com/questions/4064444/returning-json-from-a-php-script — Sam Segers, Jan 02 '16 at 12:13

score 2 · Accepted Answer · answered Jan 02 '16 at 12:42

2

Try this in another page and show in console.

<?php
if($_POST){
header('Content-type:application/json');
$data = Array(
'status' => '1',
'msg' => '',
'progress' => '0.24',
'time' =>'<span class="text-white">06:51</span> left (at 21KB/sec)',
'size' => '<span class="text-white">26KB</span> / 10.91MB (0.24%)');
echo json_encode($data);
exit();
}

?>
<input type="button" onclick="senddata()" value="send" />
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script> 
function senddata(){
    var upload_id=1
    $.post('test.php' , { upload_id: upload_id },
    function (response) {
    console.log(response.status);
    }, "json");
} 
</script>

answered Jan 02 '16 at 12:42

Alfiza malek

994
1
14
36

1

Just copy this code in test.php and show in console what is response. – Alfiza malek Jan 02 '16 at 12:45
with `header('Content-type:application/json');` or without it it works 1 – Adam Mo. Jan 02 '16 at 12:48
1

ya it with or without header('Content-type:application/json'); work. – Alfiza malek Jan 02 '16 at 12:51
Well , you solved it. the real php code was passed text string with the json so it was not real json, you code made me look at the php return. – Adam Mo. Jan 02 '16 at 13:41
your json response is :- {"status":1,"msg":"","progress":"0.15","time":"11:11<\/span> left (at 10KB\/sec)","size":"16KB<\/span> \/ 10.91MB (0.15%)"} – Alfiza malek Jan 21 '16 at 10:41
It should be :-[{"status":1,"msg":"","progress":"0.15","time":"11:11<\/span> left (at 10KB\/sec)","size":"16KB<\/span> \/ 10.91MB (0.15%)"}] – Alfiza malek Jan 21 '16 at 10:42
means you missed '[]' square brackets thats why return error. – Alfiza malek Jan 21 '16 at 10:45

score 0 · Answer 2 · answered Jan 02 '16 at 12:11

Is your server sending data as Content-Type "*/json"? If not, modify the response headers accordingly. Sending "application/json" would be fine, for example. And the code would be: header('Content-type:application/json');

Another possible solution is by switching '\' to '/' in your json url.

jQuery post with JSON response

2 Answers2