Load multiple query result rows into array

Question

I'm creating a RPG. When the user logs in, I want to load their data from three tables:

• quest_items stores all data related to an item:

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

• userstats stores user_id, current map, current quest, x y location, etc

Since I want to load all this data on runtime, I figured I'd just put the two queries in the same function, store results in separate arrays, then push those two arrays into allData array. Then encode allData and pass it back to JS.

The problem here is accessing the data in the $.(each loop:

---

PHP:

$allData = array();
$itemsArray = array();
$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()) {
    $itemsArray[] = $row;
}   

$qry = 
    'SELECT us.* 
    FROM userstats us
    WHERE us.id_user_fk = "' . $playerID . '"';

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

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

array_push($allData, $itemsArray, $statsArray);

echo json_encode($allData);

JavaScript snippet:

I'm able to access the first array ($itemsArray) within $allData with v[0].item_name from quest_items table, which gives: rice, test/path.png as expected.

But if I try to access the second array v[1].username from userstats table, it gives undefined.

$.getJSON("phpscripts.php", {
    "_player" : Player,
    "_playerID" : UserID
},
function(returned_data) {                       
    $.each(returned_data, function (key, value) {       
        $(".questItems").append("<br/>" + value[1].username + ", " + value[0].item_name);   
    });

• value[1].username = undefined
• value[0].item_name = works

This is curious because the chrome debugger response shows that both arrays are being added and returned inside the container array:

Why is this? Why can't I access array 2 with value[1].username?

---

EDIT:

$.each(returned_data, function (key, value) {               
    console.log(value[1]);  
});

Gives:

Object {item_id: "2", item_name: "meat", item_chinese: "rou", ...   (index):29
undefined (index):29

Which is a result set from value[0]. Maybe what's happening is either

• since value[0] has more result rows than does value[1], maybe it's looping through again for value[1] even though it is passed its array size. Would that break it?

• value[1] is actually accessing the second array value from the first items array... and not pointing to the userstats array?

---

EDIT 2:

console.log(returned_data) right after function(returned_data) gives:

[Array[2], Array[1]]
0: Array[2]
1: Array[1]
length: 2
__proto__: Array[0]

console.log(value); right after $.each(returned_data, function (key, value) { gives:

[Object, Object]
0: Object
1: Object
length: 2
__proto__: Array[0]

[Object]
0: Object
length: 1
__proto__: Array[0]

Expanded results of console.log(returned_data); after function(returned_data):

---

EDIT 3: It works if I manually access the array: returned_data[1][0]["username"]

function(returned_data) {
    console.log(returned_data[1][0]["username"]); //DAN
    console.log(returned_data[0][0]["item_name"]); //rice
    console.log(returned_data[0][1]["item_name"]); //meat

But what if I have a lot of data rows to return for item_name. I need a loop to get all data.

Answer 1

The first time the function passed to $.each() runs, value is the 0 subcontainer which has 0 and 1. The second time the function runs, value is the 1 subcontainer already.

If returned_data[0] and returned_data[1] are different and you want to do different things with them, don't use $.each(), just use returned_data[0] and returned_data[1].

So:

$.each(returned_data[0], function (key, value) {       
    $(".questItems").append("<br/>" + returned_data[1][0].username + ", " + value[0].item_name);   
});