Chekbox dependientes

cesar16 · #1 (**permalink**) 01/02/2006, 12:19

Hola!

Como puedo hacer que en una lista de chekbox que obtengo de una bd al clicar uno se desmarque el chekbox "todos" (de distinto nombre) y a la inversa. Que al selecionar el checkbox todos se demarquen todos los de la lista.

Espero me podais echar una manita.

Cap.Buscapina · #2 (**permalink**) 01/02/2006, 19:46

Cita:

<html>
<head>
<script>
function todos(){
ch=document.forms['form1'].elements;
for(x=1;x<ch.length;x++){
if(ch[0].checked==true){
ch[x].checked=true;
}else{
ch[x].checked=false;
}
}
}

function comprobar(c){
document.forms['form1']['checkbox'].checked=false;
}
</script></head>

<body>
<form name="form1" method="post" action="">
<p>
<input type="checkbox" name="checkbox" value="checkbox" onclick="todos()">
todos </p>
<p>
<input type="checkbox" name="checkbox2" value="checkbox" onclick="comprobar(this)">
uno<br>
<input type="checkbox" name="checkbox3" value="checkbox"onclick="comprobar(this)">
dos<br>
<input type="checkbox" name="checkbox4" value="checkbox" onclick="comprobar(this)">
tres<br>
<input type="checkbox" name="checkbox5" value="checkbox" onclick="comprobar(this)">
cuatro<br>
<input type="checkbox" name="checkbox6" value="checkbox" onclick="comprobar(this)">
cinco<br>
<input type="checkbox" name="checkbox7" value="checkbox" onclick="comprobar(this)">
seis<br>
<input type="checkbox" name="checkbox8" value="checkbox" onclick="comprobar(this)">
siete<br>
<input type="checkbox" name="checkbox9" value="checkbox" onclick="comprobar(this)">
ocho<br>
</p>
</form>
</body>
</html>

suerte

cesar16 · #3 (**permalink**) 02/02/2006, 04:42

El script está muy bien, pero....
¿Como se puede utilizar si pongo el chekbox que marca todos al final?

Me he dado cuenta que no funciona de esta forma.

JavierB · #4 (**permalink**) 02/02/2006, 04:49

Hola cesar16

Con permiso de Cap.Buscapina, modifico un poco el código:

Código:

<html>
<head>
<script>
function todos(){
ch=document.forms['form1'].elements;
for(x=0;x<ch.length-1;x++)
ch[x].checked = ch[ch.length-1].checked;
}

function comprobar(c){
document.forms['form1']['checkbox'].checked=false;
}
</script></head>

<body>
<form name="form1" method="post" action="">
<p>
<input type="checkbox" name="checkbox2" value="checkbox" onclick="comprobar(this)">
uno<br>
<input type="checkbox" name="checkbox3" value="checkbox"onclick="comprobar(this)">
dos<br>
<input type="checkbox" name="checkbox4" value="checkbox" onclick="comprobar(this)">
tres<br>
</p>
<p>
<input type="checkbox" name="checkbox" value="checkbox" onclick="todos()">
todos </p>
</form>
</body>
</html>

Saludos,

cesar16 · #5 (**permalink**) 02/02/2006, 05:06

Muy buena la modificación, pero lo que estoy intentando es que marque o la casilla todos o alguno de los articulos. No que al marcar el chekbox "todos" se marquen sino que se desmarquen.

Código HTML:

<html>
<head>
<script>
function todos(){
ch=document.forms['form1'].elements;
for(x=1;x<ch.length;x++){
if(ch[0].checked==true){
ch[x].checked=false;
}else{
ch[x].checked=true;
}
}
}

function comprobar(c){
document.forms['form1']['checkbox'].checked=false;
}
</script></head>

<body>
<form name="form1" method="post" action="">
<p><input type="checkbox" name="checkbox" value="todos" onclick="todos()"> todos </p>

<p> 
<input type="checkbox" name="seleccion[]"  value="2" onclick="comprobar(this)">
uno<br>
<input type="checkbox" name="seleccion[]" value="1" onclick="comprobar(this)">
dos<br>
<input type="checkbox" name="seleccion[]"  value="3" onclick="comprobar(this)">
tres<br>
<input type="checkbox" name="seleccion[]"  value="4"  onclick="comprobar(this)">
cuatro<br>
<input type="checkbox" name="seleccion[]" value="6" onclick="comprobar(this)">
cinco<br>
<input type="checkbox" name="seleccion[]"  value="8" onclick="comprobar(this)">
seis<br>
<input type="checkbox" name="seleccion[]"  value="9" onclick="comprobar(this)">
siete<br>
<input type="checkbox" name="seleccion[]"  onclick="comprobar(this)">
ocho<br>
</p>

</form>
</body>
</html>

JavierB · #6 (**permalink**) 02/02/2006, 05:31

Hola de nuevo.

Parece que lo he entendido al revés. Prueba cambiando esta línea:

ch[x].checked = !ch[ch.length-1].checked;

Saludos,

luisvasquez · #7 (**permalink**) 31/10/2007, 15:24

Que tal amigos y amigas...

Este código funciona muy bien....peroooo...

cuando en el formulario hay otros campos, además de los checkboxes, entonces no anda bien...

Fijense en el código que incluye otros campos...

Se les ocurre alguna solución?

Saludos, Luis Vásquez

Código:

<html>
<head>
<script>
function todos(){
ch=document.forms['form1'].elements;
alert('el formulario tiene :'+ch.length+' campos. ¿como saber cuales son checkboxes?');

for(x=0;x<ch.length-1;x++)
ch[x].checked = ch[ch.length-1].checked;
}

function comprobar(c){
document.forms['form1']['checkbox'].checked=false;
}
</script>


</head>

<body>
<form name="form1" method="post" action="">
<p><br>
</p>
<table width="723" border="1">
  <tr>
    <td><input type="checkbox" name="checkbox2" value="checkbox" onClick="comprobar(this)">
uno</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="checkbox3" value="checkbox"onClick="comprobar(this)">
dos</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><label>
      <input type="text" name="textfield" id="textfield">
    </label></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="checkbox4" value="checkbox" onClick="comprobar(this)">
tres</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><label>
      <select name="select" id="select">
      </select>
    </label></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="checkbox" value="checkbox" onClick="todos()">
todos </td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td><label>
      <input type="submit" name="button" id="button" value="Enviar">
    </label></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
<p><br>
<br>
</p>
<p>&nbsp;</p>
</form>
</body>
</html>

JavierB · #8 (**permalink**) 31/10/2007, 15:31

Hola luisvasquez

Pon así el checkbox "todos":

Código:

<input type="checkbox" name="checkbox" value="checkbox" onClick="todos(this)">

Y utiliza esta función:

Código:

function todos(obj){
  for (i=0; ele = obj.form.elements[i]; i++)
    if (ele.type=='checkbox') ele.checked = obj.checked;
}

Saludos,

luisvasquez · #9 (**permalink**) 31/10/2007, 16:09

Gracias!

Funciona perfectamente....!

Saludos, Luis