Getting PHP array through AJAX

Question

I want to create comments with AJAX, I do not know if this is the right way its my first time doing it. I have been searching google for hours and im really stuck.

What I want to achieve is to add a comment right after I click 'comment' button wihtout reloading the page.

I do not know how to create JSON array that will suit my needs.

This is my javascript:

$(function(){
var userComments = $('.userComments');
var commentsUrl="commentsLoad.php";
$.ajax({
 type: 'GET',
 url: commentsUrl,
 dataType: "json",
 success: function(komentarji){
 //$.each ...
 userComments.append("output...");
 },
 error: function(e){
 console.log(e);
 } 
 });
});

This is my PHP:

include('config.php');
$comments=array();
$commentsQuery = "SELECT * FROM komentarji";
$result = $conn->query($commentsQuery);
 if($result->num_rows>0){
 while($row = $result->fetch_assoc()){
 $comments=array( 
 'id' => $row['id'],
 'name' => $row['name'],
 'text' => $row['text'],
 'date' => $row['date'])
 ); 
 header('Content-type: application/json');
 echo json_encode($comments);
 }
 }

• Rayon: What is not working ?
• Troix: $.ajax gets into error function if I have more than one comment in database
• RiggsFolly: No its because you are trying to return data to the ajax code more than once

Answer 1

The path that you're on is almost perfectly paved. Except the following you need to take note of:

1. You should echo the result array in the JSON format outside the while loop.
2. Since you have specified the dataType as json in your ajax call (and telling jQuery that you are expecting json back from the server), $.ajax will handle the headers itself and therefore header('Content-type: application/json'); is not needed.

3. A little tweak on the assignment that you're doing on $comments array:

   $comments[] = array( // without [] you'll always end up with ONE comment
    'id' => $row['id'],
    'name' => $row['name'],
    'text' => $row['text'],
    'date' => $row['date']
    ); 
   

4. Just as you have hinted subtly, you need to iterate the returned array and append each comment one-by-one:

   success: function(komentarji){
   var parsedComments = JSON.parse(komentarji); //parse the result to Javascript readable objects
    $.each(parsedComments, function(){
    userComments.append("id =>" + this.id + " name => " + this.name + " text =>" + this.text /* etc. */); //you can access each column key as javascript object key here
    });
   }, //... 
   

Note: There is a typo in the array assignment that you're doing, just remove the ) on the line 'date' => $row['date']) and you'll be fine.

Answer 2

First of all, move the returning of data back to the javascript code out of the while loop so you only do it once. Then change the script a little so that each comment is added to a new occurrence in the $comments array.

include('config.php');
$comments=array();
$commentsQuery = "SELECT * FROM komentarji";
$result = $conn->query($commentsQuery);
if($result->num_rows>0){
 while($row = $result->fetch_assoc()){
 $comments[] = array( 
 'id' => $row['id'],
 'name' => $row['name'],
 'text' => $row['text'],
 'date' => $row['date'])
 ); 
 }
}
echo json_encode($comments);
exit;

• charlietfl: @Troix then you need to inspect the actual request in dev tools network for more clues. Sounds like you have more problems than what is shown
• RiggsFolly: You need to process the returned array in your javascript code and append one item per array occurance in the js code. Your js code seems to be assuming you are returning pre-written html, but your PHP was not building html
• Troix: Thanks your answer helped a lot! :)

Answer 3

You can't send more than one json output but you are sending one in each iteration of while loop

Also can't keep adding header

what you will be sending will look like

{"id": 3 , "name": "foo"}
{"id": 4 , "name": "bar"}

Note that there is no outer array wrapping these or comma separating them. Thus they are invalid json when sent together.

Put all the comments into one array and send that instead

• Troix: Yes, I know I must do that but I don't know how.

Answer 4

Try this:

include('config.php');
$comments = array();
$commentsQuery = "SELECT * FROM komentarji";
$result = $conn->query($commentsQuery);
if ($result->num_rows > 0) {
 while ($row = $result->fetch_assoc()) {
 array_push($comments, array('id' => $row['id'], 'name' => $row['name'], 'text' => $row['text'], 'date' => $row['date']));
 }
 return json_encode(array('status' => true, 'data' => $comments));
} else {
 return json_encode(array('status' => false));
}

Also return status with response so that it will be easier to manipulate response

• Troix: I used just the 'array_push' line of your code and its already working. Thank you!