Echo all json_encoded rows

Question

I'm trying to loop through my database and output all rows with a match to the joined table.

I have the following two tables:

quest_items stores all data related to an item:

join_questitems stores association between player ID and the items that player has:

JS: pass in all the necessary info to query the table...

$.getJSON("phpscripts.php", {
    "_player" : Player,
    "_playerID" : UserID
},
function(returned_data) {
    var item_name = returned_data.item_name;
    item_image = returned_data.item_image;

    $(".questItems").html(item_name + ", " + item_image);       
   }
);  

PHP:

$statsArray = array();
$qry = 
    'SELECT qi.* 
    FROM quest_items qi
    LEFT JOIN join_questitems jqi ON (qi.item_id = jqi.item_id)
    WHERE jqi.user_id = "' . $playerID . '"';

$result = $mysqli->query($qry) or die(mysqli_error($mysqli));

while ($row = $result->fetch_assoc()) {
    $myrow = json_encode($row);
    array_push($statsArray, $myrow);
}   
$k = 0;
while ($k < count($statsArray)) {
    echo $statsArray[$k];
    $k++;
}

But if I just do one row, I get output, but only for one row. I need both rows:

while ($row = $result->fetch_assoc()) {
    echo json_encode($row);
    exit;
}   

$(".questItems").html(item_name + ", " + item_image) gives: rice, test/path.png

Why can't I loop through the PHP array full of json_encoded rows and output them? Do I have to set item_name and item_image as arrays and loop through the arrays?

---

EDIT:

• $(".questItems").append(item_name + ", " + item_image) doesn't work either

• network output from debugger shows rows are being output, but in the first row, my UTF-8 character, fàn, is being garbled in the client output (as you can see). This is curious, as at the top of my phpscripts.php file, I put mysqli_set_charset($mysqli, "utf8");

Answer 1

You shouldn't encode each row separately. Put all the results in an array, and then call json_encode on that array when you're done:

while ($row = $result->fetch_assoc()) {
    $statsArray[] = $row;
}
echo json_encode($statsArray);

Then in Javascript you need to loop over the returned array:

$.getJSON("phpscripts.php", {
    "_player" : Player,
    "_playerID" : UserID
},
    function(returned_data) {
        $.each(returned_data, function(i, e) {
            var item_name = e.item_name;
            var item_image = e.item_image;

            $(".questItems").append(item_name + ", " + item_image + "<br/>");       
        });
    };  
);

Answer 2

rather than this:

while ($row = $result->fetch_assoc()) {
    echo json_encode($row); 
    exit; //<--- this code breaks the while loop;
}  

have this:

$quest_items = array();
while ($row = $result->fetch_assoc()) {
    $quest_items[] = $row;
}  

echo json_encode($quest_items);
exit;

because exit triggers the script to stop(even inside loops) so you will only get the first row.