Pasar un vector de un archivo JS a uno PHP

[Koden]

Saludos a todos.

Veréis, estoy desarroyando una aplicación de reserva de habitaciones con AJAX y me he encontrado un problema.

En principio, la aplicación tiene un desplegable (el número de habitaciones que se van a reservar) y en función de este, desplega otros dos por cada habitación seleccionada (el número de adultos y de niños por habitación)

Yo lo que quería era hacer dos vectores, uno con el número de adultos (por habitación) y el otro con el número de niños.

Los vectores los relleno así. (Os pongo una simplificación del script original)

Código javascript:

for (x = 0; x <= ob_3.value; x++)
{
    ob_4[x] = document.getElementById("name_attendee_" + x + "_a");
    ob_5[x] = document.getElementById("name_attendee_" + x + "_b");
}
 
var a_php = "";
var total = 0;
 
for (var key in ob_4)
{
    ++ total;
    a_php = a_php + "s:" +
        String(key).length + ":\"" + String(key) + "\";s:" +
        String(ob_4[key]).length + ":\"" + String(ob_4[key]) + "\";";
}
 
a_php = "a:" + total + ":{" + a_php + "}";
 
var b_php = "";
var total = 0;
 
for (var key in ob_5)
{
    ++ total;
    b_php = b_php + "s:" +
        String(key).length + ":\"" + String(key) + "\";s:" +
        String(ob_5[key]).length + ":\"" + String(ob_5[key]) + "\";";
}
 
b_php = "b:" + total + ":{" + b_php + "}";
 

Después, los envío por GET.

Código javascript:

ajax.open ("GET", "php/query2.php?a_php=" + a_php + "&b_php=" + b_php, true);
 

Al llegar al script php (query2.php) los tomo así:

Código php:

$my_arr_a = unserialize(urldecode(stripslashes($_GET["a_php"])));
$my_arr_b = unserialize(urldecode(stripslashes($_GET["b_php"])));
 

Pero al hacer un print_r sobre ellos, me salen vacíos (cuando no debería ser así)

El caso es que soy bastante novato tanto en AJAX (es mi primer proyecto) como en Javascript (con el que nunca me he llevado del todo bien) con lo que entiendo que es muy probable que esté creando mal el array en Javascript, pero sigo sin ver de qué manera.

Si alguien pudiese echarme una mano se lo agradecería.

Un saludo.

[venkman]

No te compliques tanto.

Supongamos que tienes los valores de adultos y niños en los arrays ya metidos, ok? Para el ejemplo lo pongo así:

Código javascript:

var adultos = [2,1,2,0,0];
var hijos = [1,0,0,2,2];
 

Ahora, para enviarlos prepáralos únicamente haciendo esto:

Código javascript:

ajax.open ("GET",
           "php/query2.php?adultos=" + adultos.join("/") + "&hijos=" + hijos.join("/"),
           true);
 

Haciendo eso lo que estás enviando es:

Código:

?adultos=2/1/2/0/0&hijos=1/0/0/2/2

Así que luego en PHP, para leerlos lo único que necesitas hacer es:

Código php:

$adultos = split("/",$_GET["a_php"]);
$hijos = split("/",$_GET["b_php"]);
 

(También sería bueno revisar los arrays para comprobar que los datos son buenos y esas cosas, claro)

[GatorV]

O usar json para enviar los valores como un objeto, y rescatarlos en php y usar json_decode.

Saludos.

[Koden]

Bueno, siguiendo el consejo de GatorV he optado por hacerlo con JSON... (Ya que estamos aprendiendo AJAX, sigamos aprendiendo aunque cueste un poco más llevarlo a cabo...) Y ni que decir tiene que decidir hacerlo con JSON ya ha empezado a darme problemas.

Para empezar, los datos que tengo que tomar son en función de un desplegable, y debido a mi poco dominio de Javascript no sé si estoy tomando los valores correctamente.

Así es como lleno el vector.

Código javascript:

for (x = 0; x <= ob_3.value; x++)
{
    ob_4[x] = document.getElementById("name_attendee_" + x + "_a");
    ob_5[x] = document.getElementById("name_attendee_" + x + "_b");
}
 
arr_a = "[";
 
for (x2 = 0; x2 <= ob_4.length; x2 ++)
{
    arr_a = arr_a + "{num_hab:'" + x2 + "',num_ad:'" + ob_4[x2].value + "'}"
}
 
arr_a = arr_a + "]";
 
ajax.open ("GET", "php/query2.php?a_php=" + arr_a, true);
 

Luego, en PHP, tomo el vector y lo proceso de este modo:

Código php:

$valores = stripslashes($_GET['a_php']);
$decoded = json_decode($valores,true);
 
print_r ($decoded)
 

Pero no me muestra ni un miserable Array()

Y el caso es que no tengo claro si tengo el error al llenar el array, o si por el contrario, lo tengo al visualizarlo en PHP.

¿Alguien sabría echarme una mano?


Muchas gracias a todos por vuestro tiempo y un saludo.

[venkman]

Cada elemento del array debe ir separado por comas. Es decir, tienes que construirlo así:

[{num_hab:0,num_ad:1}, {num_hab:1,num_ad:2}, {num_hab:2,num_ad:1}]

Te están faltando esas comas.

[Koden]

Saludos a todos.

He sustituído al final el script por este otro (gracias a todos por vuestras colaboraciones) pero sigue sin funcionarme.

Código Javascript:

for (x = 0; x <= ob_3.value; x++)
{
          ob_4[x] = document.getElementById("name_attendee_" + x + "_a");
}
 
arr_a = "[";
       
for (x2 = 0; x2 <= ob_4.length; x2 ++)
{
        if (x2 == ob_4.length)
            arr_a = arr_a + "{num_hab:" + "'" + x2 + "',num_ad:'" + ob_4[x2].value + "'}"
        else
            arr_a = arr_a + "{num_hab:" + "'" + x2 + "',num_ad:'" + ob_4[x2].value + "'},"
}
 
arr_a = arr_a + "]";
 
ajax.open ("GET", "php/query2.php?a_php=" + arr_a, true);
 

La consola de errores de Firefox me dice que ob_4[x2] es indefinido (cuando es un valor de un desplegable que previamente he tenido que seleccionar) con lo que ob_4[x2].value me dice que es nulo...

¿Hay algo que esté haciendo mal?

Toda ayuda o dato que me sirva para seguir avanzando será agradecido.


Un saludo a todos.

[colote]

Hola Koden !!!

Fijate a ver si te sirve esta ayuda !!!

Esto use para pasar un array de javascript a PHP, pero no estoy usando AJAX, por ahi te sirve la idea !!!

En el archivo funciones.js tengo asi :

Código PHP:

  function tu_funcion(e)
{
var preciojs1 = new Array();
var preciojs2 = new Array();

//rellenas tus arrays

  var obj={preciopes : preciojs1,
preciodol:preciojs2};
  var cadena=obj.toJSONString();
  enviarDatos(cadena);


addEvent(window,'load',inicializarEventos,false);

function inicializarEventos()
{
  var ref=document.getElementById('boton1');
  addEvent(ref,'click',tu_funcion,false);
}

//***************************************
//Funciones comunes a todos los problemas
//***************************************
function addEvent(elemento,nomevento,funcion,captura)
{
  if (elemento.attachEvent)
  {
    elemento.attachEvent('on'+nomevento,funcion);
    return true;
  }
  else  
    if (elemento.addEventListener)
    {
      elemento.addEventListener(nomevento,funcion,captura);
      return true;
    }
    else
      return false;
}


var conexion1;
function enviarDatos(cadena) 
{
  conexion1=crearXMLHttpRequest();
  conexion1.onreadystatechange = procesarEventos;
  conexion1.open('GET','actualiza.php?cadena='+cadena, true);
  conexion1.send(null);
}

function procesarEventos()
{
  var resultados = document.getElementById('resultados');
  if(conexion1.readyState == 4)  //
  {
    resultados.innerHTML = conexion1.responseText;
  } 
  else 
  {
    resultados.innerHTML = "<b>Grabando... Aguarde unos instantes</b>";
  }
}

function crearXMLHttpRequest() 
{
  var xmlHttp=null;
  if (window.ActiveXObject) 
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  else 
    if (window.XMLHttpRequest) 
      xmlHttp = new XMLHttpRequest();
  return xmlHttp;
}  
   

Y en actualiza.php los tomo asi ... !!!

Código PHP:

  
?php
require('json.php');
include('conexion.php');
$json=new Services_JSON();
$cad=$json->decode(stripslashes($_GET['cadena']));

// al for le puse 10, pero en realidad es el tamaño del array !!!
for($i=0;$i<=10;$i++)
{
    echo $precio1=$cad->preciopes[$i]; echo " ";
    echo $precio2=$cad->preciodol[$i]; echo "<br>";
}  
   

Y si te ayuda los arrays los cargo desde una paginita asi :

Código HTML:

<input type="button" value="Enviar" id="boton1">
<a href="inicio.php"><img src="botones/volver.png" alt="volver" border="0"/></a>
<br>
<div id="resultados">Actualizando !!!</div>

<input type="hidden" size="4" name="precioss1[]">
<input type="hidden" size="4" name="precioss2[]"> 

No se si esto te ayude, soy medio novato en este tema !!!!!!
La ayuda la saque tambien de www.ajaxya.com.ar, hay un listado de temas en el cual uno dice
"De JSON a PHP (utilizando la librería JSON.php)".
Suerte !!!
Saludos, Ricardo !!!

[venkman]

Una cosa que estás haciendo mal es: x2 <= ob_4.length. Para recorrer ob_4 te tienes que parar en x2 < ob_4.length

(Si la longitud del array es. p.ej. 7, existen ob_4[0] hasta ob_4[6] pero no existe ob_4[7])

[Koden]

Muchísimas gracias a todos por vuestras respuestas.

Aún sigo peleándome con el script de marras.

Después de crear y enviar los arrays así:

Este código va en ajax.js

Código javascript:

ob_4 = "";
ob_5 = "";
 
for (x = 0; x < ob_3.value; x++)
{
    ob_4[x] = document.getElementById("name_attendee_" + x + "_a");
    ob_5[x] = document.getElementById("name_attendee_" + x + "_b");
}
 
arr_a = "[";
 
for (x2 = 0; x2 < ob_4.length; x2 ++)
{
    if (x2 == ob_4.length)
        arr_a = arr_a + "{num_hab:" + "'" + x2 + "',num_ad:'" + ob_4[x2].value + "'}"
    else
        arr_a = arr_a + "{num_hab:" + "'" + x2 + "',num_ad:'" + ob_4[x2].value + "'},"
}
 
arr_a = arr_a + "]";
 
arr_b = "[";
 
for (x2 = 0; x2 < ob_5.length; x2 ++)
{
    if (x2 == ob_5.length)
        arr_b = arr_b + "{num_hab:" + "'" + x2 + "',num_ad:'" + ob_5[x2].value + "'}"
    else
        arr_b = arr_b + "{num_hab:" + "'" + x2 + "',num_ad:'" + ob_5[x2].value + "'},"
}
 
arr_b = arr_b + "]";
 
ajax = objetoAjax ();
ajax.open ("GET", "php/query2.php?a_php=" + arr_a + "&b_php=" + arr_b, true);
 

Y de procesarlos con php así

Este código va en query2.php

Código PHP:

$valores_1 = stripslashes($_GET['a_php']);
$decoded_1 = json_decode($valores_1, true);
$valores_2 = stripslashes($_GET['b_php']);
$decoded_2 = json_decode($valores_2, true);
echo "Este es el contenido del vector <br />" . var_dump ($decoded_1) . "<br />";
echo "Este es el contenido del vector <br />" . var_dump ($decoded_2) . "<br />";
 

Obtengo en ambos casos este resultado:

Código:

array(0) { }

Con lo que sospecho, que es en la parte de JavaScript (seguramente, pagando el precio de mi novatez) donde creo que no estoy llenando bien el vector...

¿Quizás estoy haciéndolo mal? (ob_3, ob_4 y ob_5 son selects HTML y no sé a ciencia cierta si estoy tomando bien sus valores) ¿Habría alguna manera de interrumpir el script js para poder ver los valores que están tomando los arrays en cada posición?

Muchas gracias de nuevo a todos por vuestra ayuda.

Un saludo.

[venkman]

1. Si sospechas que no estás construyendo bien los datos que envías no tienes más que comprobarlo. Antes de la línea del ajax.open(...) mete:

Código javascript:

alert("a: " + arr_a + "\nb: " + arr_b);
 

2. No acabo de entender muy bien por qué tanta insistencia en el lado de PHP de hacer stripslashes. No estoy 100% seguro pero yo diría que en todo caso lo que necesitas más que un stripslashes es hacerle urldecode.

[Koden]

Gracias por tu aporte, venkman.

Efectivamente, y tal y como sospechaba, el vector está vacío desde el mismo javascript, por lo que intentaré cargar sus valores de otra manera.

De todos modos, me apunto tu sugerencia a la hora de tratar los datos una vez me lleguen a PHP.

¡Sigo probando!

¡¡Un saludo!!

[venkman]

Pista: Si s = document.getElementById("miSelect") es un select, puedes acceder al array de opciones con s.options (s.options[0], s.options[1] ...)

[Koden]

Muchas gracias, aunque lo que peor llevo es intentar concatenar el número para que se genere automáticamente con un for.

Código javascript:

//He observado que ob_3.value llega perfecto
for (x = 0; x < ob_3.value; x++)
{
    //Aquí es donde creo que está el problema, al concatenar
    ob_4 = document.getElementById("name_attendee_" + x + "_a");
    ob_5 = document.getElementById("name_attendee_" + x + "_b");
}
 

Así que voy a intentar tomar el valor del campo por el nombre del mismo, a ver si tengo así más suerte...

[Koden]

Lo conseguí (o eso creo, la verdad es que no tengo demasiado claro el estar pillando correctamente los options seleccionados en el select)

Al final, ha quedado así:

Código javascript:

for (x = 0; x < ob_3.value; x++)
{
    ob_4 = document.getElementById("name_attendee_" + x + "_a");
    ob_5 = document.getElementById("name_attendee_" + x + "_b");
}
 
arr_a = "[";
 
for (x2 = 0; x2 < ob_3.value; x2 ++)
{
    if (x2 == ob_3.value)
        arr_a = arr_a + "{num_hab:" + "'" + (x2 + 1) + "',num_ad:'" + ob_4.value + "'}"
    else
        arr_a = arr_a + "{num_hab:" + "'" + (x2 + 1) + "',num_ad:'" + ob_4.value + "'},"
}
 
arr_a = arr_a + "]";
 
arr_b = "[";
 
for (x2 = 0; x2 < ob_3.value; x2 ++)
{
    if (x2 == ob_3.value)
        arr_b = arr_b + "{num_hab:" + "'" + (x2 + 1) + "',num_ni:'" + ob_5.value + "'}"
    else
        arr_b = arr_b + "{num_hab:" + "'" + (x2 + 1) + "',num_ni:'" + ob_5.value + "'},"
}
 
arr_b = arr_b + "]";
 

Ahora sólo queda recibirlo bien en PHP.

Muchísimas gracias por la ayuda.

[venkman]

El primer bucle for no tiene mucho sentido como bucle, Koden. En cada pasada del bucle reasignas ob_4 = ... con lo que el único valor que quedará será el de la última pasada. Es decir, que podrías reducir ese bucle a:

Código javascript:

ob_4 = document.getElementById("name_attendee_" + (ob_3.value-1) + "_a");
ob_5 = document.getElementById("name_attendee_" + (ob_3.value-1) + "_b");
 

¿Es eso lo que intentas hacer o es otra cosa? Porque así tengo la sensación de que vas a meter el mismo valor todo el rato en los arrays.

[Koden]

Bueno, a falta de pillar bien los índices ya he dado como pasar el vector a PHP. (Cambiando eso sí, un par de cosillas al formar los array)

Código javascript:

arr_a = "[";
 
for (x2 = 0; x2 < ob_3.value; x2 ++)
{
    if (x2 == (ob_3.value - 1))
        arr_a = arr_a + "{\"num_hab\":" + (x2 + 1) + ",\"num_ad\":" + ob_4.value + "}"
    else
        arr_a = arr_a + "{\"num_hab\":" + (x2 + 1) + ",\"num_ad\":" + ob_4.value + "},"
}
 
arr_a = arr_a + "]";
 
arr_b = "[";
 
for (x2 = 0; x2 < ob_3.value; x2 ++)
{
    if (x2 == (ob_3.value - 1))
        arr_b = arr_b + "{\"num_hab\":" + (x2 + 1) + ",\"num_ni\":" + ob_5.value + "}"
    else
        arr_b = arr_b + "{\"num_hab\":" + (x2 + 1) + ",\"num_ni\":" + ob_5.value + "},"
}
 
arr_b = arr_b + "]";
 

Para pasar los valores del array js a un array php sólo se necesitan estas líneas (al menos para como yo estoy montando el array):

Código PHP:

$a_php = json_decode (stripslashes (urldecode ($_GET['a_php'])), true);
$b_php = json_decode (stripslashes (urldecode ($_GET['b_php'])), true);
 

Y te explico lo que quiero hacer (quizás no me haya expresado con la suficiente claridad, te pido disculpas )

Verás, tengo un select donde escojo un número de habitaciones que quiero reservar, hasta un máximo de cinco.

Código HTML:

<div id="hab">
        <label for="num_attendees">
       	    	N&uacute;mero de habitaciones<br />
		<select id="num_attendees" tabindex="3">
			<option value="0">Seleccione</option>
			<option value="1">1</option>
			<option value="2">2</option>
			<option value="3">3</option>
			<option value="4">4</option>
			<option value="5">5</option>
		</select>
	</label>
</div> 

De ahí, hago aparecer a dos selects por cada habitación seleccionada (name_attendee_1_a, name_attendee_1_b, ... name_attendee_n_a, name_attendee_n_b) que básicamente asignarían el número de adultos asignados a la habitación n y el número de niños asignados a la habitación n...

Con lo que veo que tienes razón... Debería llenar ob_4 y ob_5 de la que estoy recorriendo ob_3... ¿Me equivoco?

Es decir, debería hacer esto (más o menos)

Código javascript:

for (x = 0; x < ob_3.value; x++)
{
    ob_4 = document.getElementById("name_attendee_" + x + "_a");
    ob_5 = document.getElementById("name_attendee_" + x + "_b");
 
    //Llenar arr_a y llenar arr_b
}
 

Muchas gracias por tu ayuda, venkman. ¡Gracias a tí estoy aprendiendo Javascript a marchas forzadas!

[venkman]

Sí, esa es una buena idea, la de meter el llenado de arr_a y arr_b ahí. Seguramente simplificarías bastante el código

[Koden]

Uf... La verdad es que es complicado conseguir por el id en mitad del bucle el valor seleccionado del índice del select...

Tengo el código así ahora mismo:

Código javascript:

for (x = 0; x < ob_3.value; x++)
{
    var ob_4 = document.getElementById("name_attendee_" + x + "_a").options[document.getElementById("name_attendee_" + x + "_a").selectedIndex].value;
    var ob_5 = document.getElementById("name_attendee_" + x + "_b").options[document.getElementById("name_attendee_" + x + "_b").selectedIndex].value;
 
    arr_a = "[";
 
    if (x == (ob_3.value - 1))
        arr_a = arr_a + "{\"num_hab\":" + (x2 + 1) + ",\"num_ad\":" + ob_4 + "}"
    else
        arr_a = arr_a + "{\"num_hab\":" + (x2 + 1) + ",\"num_ad\":" + ob_4 + "},"
 
    arr_a = arr_a + "]";
 
    arr_b = "[";
 
    if (x == (ob_3.value - 1))
        arr_b = arr_b + "{\"num_hab\":" + (x2 + 1) + ",\"num_ni\":" + ob_5 + "}"
    else
        arr_b = arr_b + "{\"num_hab\":" + (x2 + 1) + ",\"num_ni\":" + ob_5 + "},"
 
    arr_b = arr_b + "]";
}
 

Pero sigue dándome un error (me dice que es nulo)

¿Alguien sabría decirme si estoy haciendo algo mal?



Muchas gracias a todos y un saludo.

[venkman]

En el código que has puesto tienes aún x2 del código anterior en algunos sitios. Debería ser x, ¿no?

[Koden]

Uhmm... Sí, tienes razón, pero me refería a que me dice que document.getElementById("name_attendee_" + x + "_a") es nulo, lo otro pese a que es un error, entiendo que lo que haría sería llenar mal el vector...

De todos modos he probado a cambiarlo y me sigue fallando...

Seguiré probando a ver...

[Koden]

Uffff!!!!

¡¡Conseguí dar con ello!!

Código javascript:

arr_a = "[";
arr_b = "[";
 
for (x = 0; x < ob_3.value; x++)
{
    var ob_4 = document.getElementById("name_attendee_" + (x + 1) + "_a");
    var ob_5 = document.getElementById("name_attendee_" + (x + 1) + "_b");
 
    var in_4 = ob_4.selectedIndex;
    var in_5 = ob_5.selectedIndex;
 
    var va_4 = ob_4.options[in_4].value;
    var va_5 = ob_5.options[in_5].value;
 
    if (x == (ob_3.value - 1))
        arr_a = arr_a + "{\"num_hab\":" + (x + 1) + ",\"num_ad\":" + va_4 + "}"
    else
        arr_a = arr_a + "{\"num_hab\":" + (x + 1) + ",\"num_ad\":" + va_4 + "},"
 
    if (x == (ob_3.value - 1))
        arr_b = arr_b + "{\"num_hab\":" + (x + 1) + ",\"num_ni\":" + va_5 + "}"
    else
        arr_b = arr_b + "{\"num_hab\":" + (x + 1) + ",\"num_ni\":" + va_5 + "},"
}
 
arr_a = arr_a + "]";
arr_b = arr_b + "]";
 

¡Muchísimas gracias por tu ayuda, venkman!

[venkman]

De nada. La mayor parte del trabajo la has hecho tú mismo. Me alegro :)