PHP multidimensional array to JavaScript

Question

I want to print the data of a PHP array in a Javascript function... The problem is, it isn't working. This is how the datas get compounded in PHP:

$daten = array();
$anzahl = array();
$leads = array();
if ($result = $this->databaseConnection->query($sql)) {
 while ($row = $result->fetch_assoc()) {
 $daten[] = $row["Datum"];
 $anzahl[] = $row["Anzahl"];
 }
 $this->logger->lwrite('Leads: '. $leads);
 $leads[] = array(array("daten" => $daten), array("anzahl" => $anzahl));
 return json_encode($leads);
} 

This is what the JavaScript POST request:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
 if (this.readyState == 4 && this.status == 200) {
 console.log(this.responseText);
 }
xhttp.open("POST", "/requestLeadClicksController.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send(jQuery('#formToRequestLeadClicks').serialize());

This is what I get on console.log(this.responseText);:

[[{"daten":["2017-12-21","2017-12-22","2017-12-23"]},{"anzahl":["1","2","1"]}]] 

And either this.responseText.daten, this.responseText[0], this.responseText[0].daten or this.responseText[daten] is working to print only the data array. What I want to get is only this:

"2017-12-21","2017-12-22","2017-12-23"

Same goes for the anzahl array. I also want to have only this:

"1","2","1"

I would appreciate any kind of help! Kind regards!

• Thomas: response Text, a string ain't an object. you have to JSON.parse the string
• Don: working now, thank you! :)

Answer 1

You have an array containing an array of objects that contain arrays of strings. To get down to the innermost arrays of strings, you need two array indexes followed by an object property.

datenArray = responseText[0][0].daten,
anzahlArray = responseText[0][1].anzahl;

let responseText = [[{"daten":["2017-12-21","2017-12-22","2017-12-23"]},{"anzahl":["1","2","1"]}]],
 datenArray = responseText[0][0].daten,
 anzahlArray = responseText[0][1].anzahl;
console.log( datenArray );
console.log( anzahlArray );

• Don: Sadly not working for me... I get: Uncaught TypeError: Cannot read property 'anzahl' of undefined at XMLHttpRequest.xhttp.onreadystatechange ((index):1061)
• James Funk: It should be anzahlArray = responseText[0][0].anzahl; instead of anzahlArray = responseText[0][1].anzahl;

Answer 2

If you want to automate the return, you can use a recursive iterator (I am using jQuery to do that). This iterator works only if the keys to return are associative (not numeric), though it could be altered to do whatever you wanted:

var arr = [[{"daten":["2017-12-21","2017-12-22","2017-12-23"]},{"anzahl":["1","2","1"]}]];
var arrfin = {};
function recurse(array)
{
 $.each(array,function(k,v){
 if(typeof v === "object") {
 if(typeof k !== "number")
 arrfin[k] = v;
 else
 recurse(v);
 }
 });
}
recurse(arr);
console.log(arrfin.daten);
console.log(arrfin.anzahl);

This will give in the console:

["2017-12-21", "2017-12-22", "2017-12-23"]
["1", "2", "1"]