Estás cometiendo muchas suposiciones incorrectas en tu código.
Cambios en PHP
Para empezar, la matriz superglobal $_POST
está siempre definida, pero podría tener datos o no dependiendo del método HTTP usado y los datos POST enviados.
La mejor forma de comprobar la validez de los datos recibidos es comprobar la existencia del campo esperado (esté vacío o no) mediante isset()
:
if (isset($_POST['array')) { ... }
Además, el valor del formulario te llega en un índice de $_POST
, por lo que debes usar json_decode()
con dicho índice, y no con la matriz completa.
Te recomendaría que, en caso de que no se cumpla la condición, tu aplicación PHP devuelva algún texto para que permita depurar dicha situación. Como tu código PHP no funciona correctamente, la condición no se cumple (no se están enviando datos como formulario) y en ese caso recibe únicamente un retorno del carro (responseText: "\n"
). Eso no te ayuda a depurar qué está pasando.
El código PHP modificado quedaría de la siguiente manera:
/* Comprobamos si el campo "array" fue enviado */
if (isset($_POST["array"])) {
/* Decodificamos los datos JSON de dicho campo */
$apuesta = json_decode($_POST["array"], true);
/* Volcamos el contenido de los datos al navegador */
var_dump($apuesta);
} else {
echo "No se han recibido los datos POST requeridos";
}
Cambios en javascript
Por otro lado, estás enviando los datos de manera incorrecta a PHP. Debes codificar los datos como datos de formulario y no enviarlos como una matriz de javascript ({'array': ...}
). Si lo haces así enviarás una cadena de caracteres que contiene algo como "[object Object]", ya que es el comportamiento por defecto del método Objeto.toString()
.
La mejor forma de conseguir esto último es a través de la clase FormData
.
Por último, estás usando una petición asíncrona, pero vuelcas el contenido del estado justo tras solicitar la conexión, por lo que la propiedad XHR.readyState
vale 1
(OPENED), que significa que se ha abierto la conexión, pero aún ni tan siquiera ha respondido el servidor (el próximo estado es cuando el servidor devuelve las cabeceras HTTP).
Cuando usas peticiones asíncronas debes usar XHR.onreadystatechange
para hacer lo que quieras con la respuesta una vez que ésta haya concluido. Es decir, cuando XHR.readyState
valga 4
(DONE).
PD: En los datos de la salida de la consola de depuración aparecen dos estados diferentes: cuando XHR.readyState
valía 1
y cuando valía 4
. Posiblemente obtuviste ese último valor de manera manual tras un transcurrir un tiempo, ¿verdad?.
Aquí tienes un ejemplo del código corregido:
var request = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXobjet('Microsoft.XMLHTTP');
var ajaxUrl = base_url+'home/addApuesta';
/* Los datos deben crearse como datos de formulario, no JSON */
var data = new FormData();
/* Podemos codificar los datos en JSON dentro del campo del formulario */
data.append("array", JSON.stringify(e));
/* Configuramos la petición POST, recuerda que es asíncrona */
request.open("POST", ajaxUrl, true);
/* Como es una petición asíncrona (true) tenemos que capturar el evento */
request.onreadystatechange = function (evento) {
if (request.readyState == 4) {
if(request.status == 200) {
console.log(request.responseText);
} else {
console.log("Error cargando los datos");
}
}
};
/* Agregamos los datos del formulario */
request.send(data);
console.log(request);
var data = JSON.stringify(e)
, por cierto ¿qué contienee
?