Desplegar Menú al hacer clic en una casilla de una lista de checkbox (Tipo Gmail)

[iramriquelme]

Hola amigos, es la primera vez que me uno a un foro de programación, no se me da mucho eso de escribir. Pero prometo que trataré de participar con lo poco o mucho que sé sobre Wordpress, PHP, etc.

De momento, solicito su ayuda ya que tengo una pequeña duda con javascript y espero me puedan ayudar.

Tengo un formulario con campos del tipo:

<input type="checkbox" name="id[]" >
<input type="checkbox" name="id[]" >
<input type="checkbox" name="id[]" >

Como pueden apreciar el nombre de los campos es un ARRAY id[] y lo que intento hacer es que al seleccionar cualquier casilla checkbox de las N desplegadas... se muestre un menú con opciones tal como lo hace GMAIL

Dicho menú se encuentra en una div que podría estar oculta con CSS ya sea usando la propiedad display o la propiedad visibility:

<div id="menu">
//// Aquí va el menú que se desplegaría
</div>

He notado que cuando yo hago esto en JavaScript si funciona para un solo checkbox:

if(document["form"]["id"].checked){ //Aquí meto la instrucción JavaScript para darle visibility a la DIV }

Pero cuando le paso en el nombre del input id[] (O sea el nombre del array) el código ya no funciona....

if(document["form"]["id[]"].checked){ //Aquí meto la instrucción JavaScript para darle visibility a la DIV }

Algo que se me ocurre es contar los elementos CHECKBOX del formulario, recorrerlos todos y comparar si su valor es = a CHECKED. Pero no se exactamente como hacer este recorrido en JavaScript.

Alternativas:
También he intentado buscar una solución usando Toggle de JQuery y algunos otros métodos de javascript pero no he podido dar con la solución.

Espero me hayan entendido y me puedan ayudar.

Saludos y buen día.

[iramriquelme]

Bueno pues después de un par de horas intentando resolver el problema he aquí la solución:

Se resuelve Añadiendo la clase chk a cada campo tipo checkbox. Y utilizando un campo auxiliar que iremos incrementando y que por default tiene valor ninguno. Tal como lo hace este amigo emprear [URL="http://www.forosdelweb.com/f13/contar-numero-checkbox-activos-988604/"]en este post[/URL] en uno de los comentarios...

Hacer el recorrido con JQuery de todos los elementos con esa clase, les dejo el código esperando que alguien le sirva y así es como se convierte en mi primer aportación.

Y modificando el código del amigo [URL="http://www.forosdelweb.com/miembros/emprear/"]emprear[/URL] Para desplegar mi div que se llama MENU cuando alguien marque mas de una casilla del formulario, queda como sigue:

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){ *
$(".chk").click(function(event) {
var laclase = $(this).attr("class");
var count = $(":checkbox.chk:checked").length;
$('#contador').val(count);


if(document.getElementById("contador").value==0 || document.getElementById("contador").value=='ningun o'){
document.getElementById("menu").style.display = "none";
}
else{
document.getElementById("menu").style.display = "block";
}

});
*
$("#chk_todos").click(function(){
*
var checked_estado = this.checked;
*
if(checked_estado == true){
*$('#contador').val('todos');
document.getElementById("menu").style.display = "block";
*}else{
*$('#contador').val('ninguno');
document.getElementById("menu").style.display = "none";
*}
*$(".chk").each(function(){
*this.checked = checked_estado;
*});
});
});
//]]>
</script>