Problema con checkboxes

[Koden]

Saludos a todos.

Estoy haciendo una aplicación de reservas de habitaciones con AJAX y en uno de los últimos pasos (una vez escogidas las habitaciones) quiero hacer un array con checkboxes en el que el usuario indicará si quiere algún extra para su habitación (un ramo de rosas, botellas de cava, bombones... Cosas por el estilo)

El caso es que los checkboxes los genero dinámicamente desde la base de datos, así:

Código PHP:

  <input type="checkbox\" id=\"cb\" name=\"cb[]\" value=\"" . $r_1["id_iExt"] . "-" . $val["id"] . "\" /> 
   

El checkbox lleva dos valores, uno el id del extra solicitado (para buscarlo en la base de datos) y otro el id de la habitación para el que solicito el extra, separados ambos por un guion.

Después, en la parte de javascript, trato de procesar el array de este modo:

Código javascript:

arr_ckb = document.getElementById("cb");
 
arrEnv = "[";
 
for (x = 0; x < arr_ckb.leght; x ++)
{
    //En esta linea separo el id del extra seleccionado y el de la habitación
    //creo que es justo donde está fallando
    arrAux = arr_ckb[x].value.split('-');
 
    val = arrAux[0];
    hab = arrAux[1];
 
    if (val == null)
        val = 0
 
    if (x == (arr_ckb.leght - 1))
        arrEnv = arrEnv + "{\"val\":" + val + ",\"hab\":" + hab + "}"
    else
        arrEnv = arrEnv + "{\"val\":" + val + ",\"hab\":" + hab + "},"
}
 
arrEnv = arrEnv + "]";
 

Pero no me llega nada al siguiente script PHP (envío los arrays mediante JSON como hace poco aprendí en el foro) y al hacer un alert sobre arrEnv me muestra tan sólo un escueto '[]'

¿Alguien sabe si estoy obviando algo o haciéndolo mal?


Muchas gracias a todos y un saludo!

[Koden]

He cambiado el modo de llamar al array de checkboxes de así:

Código javascript:

arr_ckb = document.getElementById("cb");
 

A así:

Código javascript:

arr_ckb = document.forms[0].elements["cb[]"];
 

Pero al entrar en la línea del for la consola de errores de firefox me dice que:

Código:

Error: arr_ckb is undefined

Por lo que entiendo que (tal y como sospechaba ) no me está tomando los datos correctamente... ¿Hay algo que esté obviando o que esté haciendo mal?



Muchas gracias a todos por vuestra ayuda.

[venkman]

Vuelve al documentgetElementById(). Pon el código entero de la función, tal cual lo tienes.

Tiendes a poner legth en lugar de length. No sé si es un error al copiarlo aquí o si lo tienes así en tu código, pero está mal.

¿Por qué compruebas si val puede ser null?

[Koden]

El código completo de mi función es:

Código javascript:

function checkFormChecks () {
    arr_ckb = document.getElementById("cb");
    ob_1 = document.getElementById("date1");
    ob_2 = document.getElementById("date2");
 
    arrEnv = "[";
 
    for (x = 0; x < arr_ckb.length; x ++)
    {
        arrAux = arr_ckb[x].value.split('-');
 
        val = arrAux[0];
        hab = arrAux[1];
 
        if (val == null)
            val = 0
 
        if (x == (arr_ckb.length - 1))
            arrEnv = arrEnv + "{\"val\":" + val + ",\"hab\":" + hab + "}"
        else
            arrEnv = arrEnv + "{\"val\":" + val + ",\"hab\":" + hab + "},"
    }
 
    arrEnv = arrEnv + "]";
 
    ajax = objetoAjax ();
 
    ajax.open ("GET", "php/query3.php?arrEnv=" + arrEnv + "&date1=" + ob_1.value + "&date2=" + ob_2.value, true);
 
    ajax.onreadystatechange = function() {
        if (ajax.readyState == 1) {
            document.getElementById('step3').style.opacity = 1.0;
            document.getElementById("formFinal").innerHTML = "<img src='img/ajax-loader.gif' title='Cargando...' alt='Cargando...'/>";
        }
        else if (ajax.readyState == 4) {
            if (ajax.status == 200)
                document.getElementById("formFinal").innerHTML = ajax.responseText;
            else if(ajax.status == 404)
                resultado.innerHTML = "Objeto no encontrado";
            else
                resultado.innerHTML = "Error: " + ajax.status;
        }
    }
    ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    ajax.send(null);
}
 

Tenías razón en que ponía mal el length, y gracias a que me has preguntado que para qué le preguntaba si era nulo me he dado cuenta de que sólo quiero guardar el valor de los id's seleccionados (los no seleccionados se los pasaré a PHP como 0 para que los controle) con lo que tendré que cambiar el código para que sólo introduzca en el vector a los arr_ckb[x].checked.

De todos modos, acabo de probar el script con getElementById y tampoco me funciona, así que debo seguir mirando.

Gracias por tu ayuda, venkman, un saludo.

[venkman]

Y en este código, el error es el mismo (arr_ckb no está definido)?

¿En qué línea da el error, en el for seguro?

pon antes del for un alert(document.getElementById("cb")); y dime qué sale.

[Koden]

Esto es lo que me dice al hacer el alert sobre document.getElementById("cb"):

Código:

[object HTMLInputElement]

Gracias por tu ayuda, venkman.

[Koden]

Gracias por tu ayuda, venkman. Al final pude resolverlo mediante tu ayuda y la de caricatos, del que estuve leyendo varios posts como referencias.

Pese a todo, finalmente no lo hice mediante getElementById.

El código me ha quedado así:

Código javascript:

function checkFormChecks () {
    ob_1 = document.getElementById("date1");
    ob_2 = document.getElementById("date2");
 
    arrEnv = "[";
 
    for (x = 0; x < document.forms[0].elements["cb[]"].length; x ++)
    {
        arrAux = document.forms[0].elements["cb[" + x + "]"].value.split('-');
 
        val = arrAux[0];
        hab = arrAux[1];
 
        if (!document.forms[0].elements["cb[" + x + "]"].checked)
            val = 0
 
        if (x == (document.forms[0].elements["cb[]"].length - 1))
            arrEnv = arrEnv + "{\"val\":" + val + ",\"hab\":" + hab + "}"
        else
            arrEnv = arrEnv + "{\"val\":" + val + ",\"hab\":" + hab + "},"
    }
 
    arrEnv = arrEnv + "]";
 
    ajax = objetoAjax ();
 
    ajax.open ("GET", "php/query3.php?arrEnv=" + arrEnv + "&date1=" + ob_1.value + "&date2=" + ob_2.value, true);
 
    ajax.onreadystatechange = function() {
        if (ajax.readyState == 1) {
            document.getElementById('step3').style.opacity = 1.0;
            document.getElementById("formFinal").innerHTML = "<img src='img/ajax-loader.gif' title='Cargando...' alt='Cargando...'/>";
        }
        else if (ajax.readyState == 4) {
            if (ajax.status == 200)
                document.getElementById("formFinal").innerHTML = ajax.responseText;
            else if(ajax.status == 404)
                resultado.innerHTML = "Objeto no encontrado";
            else
                resultado.innerHTML = "Error: " + ajax.status;
        }
    }
    ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    ajax.send(null);
}
 

¡Gracias por la ayuda!