javascript seleccionar todas las casillas de verificación en una tabla

Quiero hacer una página que tenga una tabla de varias páginas web con casillas de verificación al lado de cada una. Quiero que el usuario pueda seleccionar varios sitios y luego buscar en los sitios usando una barra de google. Tengo una tabla donde cada celda tiene un formulario lleno de casillas de verificación. cada celda tiene un botón de verificación que verifica todas las opciones en esa celda. Me gustaría agregar una casilla de verificación para seleccionar todas las opciones en la página. (Sí, podría dejar esta opción, pero quiero saber cómo acceder a todas las casillas de las celdas de todos modos para poder buscar con google como quiero). Esto es básicamente lo que tengo. Es la sección interior de la función checkPage que necesita ayuda en este puntojavascript seleccionar todas las casillas de verificación en una tabla

<html> 
<head> 
<script type="text/javascript"> 
    function checkAll(checkname, bx) { 
     for (i = 0; i < checkname.length; i++){ 
      checkname[i].checked = bx.checked? true:false; 
     } 
    } 
    function checkPage(bx){ 


     var bxs = document.getElementByTagName ("table").getElementsByTagName ("link"); 

     for(i = 0; i < bxs.length; i++){ 
      bxs[i].checked = bx.checked? true:false; 
     } 
    } 
</script> 


</head> 
<body> 
<input type="checkbox" name="pageCheck" value="yes" onClick="checkPage(this)"><b>Check Page</b> 
<table border="1" name ="table"> 

<tr> 
    <td name ="list00"> 
     <form name ="list00"> 
      <input type="checkbox" name="Check_ctr" value="yes" onClick="checkAll(document.list00.link, this)"><b>Check All</b><dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd> 
     </form> 
    </td> 
    <td><form name ="list01"> 
      <input type="checkbox" name="Check_ctr" value="yes" onClick="checkAll(document.list01.link, this)"><b>Check All</b><dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd>  
     </form></td> 
</tr> 
<tr> 
    <td><form name ="list10"> 
      <input type="checkbox" name="Check_ctr" value="yes" onClick="checkAll(document.list10.link, this)"><b>Check All</b><dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd> 
     </form></td> 
    <td><form name ="list11"> 
      <input type="checkbox" name="Check_ctr" value="yes" onClick="checkAll(document.list11.link, this)"><b>Check All</b><dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd> 
      <input type="checkbox" name="link" value="something.com">something.com<dd> 
     </form></td> 
</tr> 
</table> 

</body> 
</html>

Fuente

2011-08-30 Bastiat

function checkAll(bx) { 
    var cbs = document.getElementsByTagName('input'); 
    for(var i=0; i < cbs.length; i++) { 
    if(cbs[i].type == 'checkbox') { 
     cbs[i].checked = bx.checked; 
    } 
    } 
}

tiene esa función se llama desde el atributo onclick de la casilla de verificación para comprobar todos

<input type="checkbox" onclick="checkAll(this)">

Editar He leído un poco tu pregunta, veo que la has intentado en tu código. la getElement s ByTagName tiene que ser plural que puede haber typo'd allí y tiene que ser una etiqueta como se especifica en la respuesta anterior

Editar: Pasando la casilla principal como parámetro permitiría alternar cheque/desmarque tal como lo sugiere vol7ron y ha sido modificado en esta respuesta de manera apropiada.

La pregunta pide todas las casillas de verificación en la página, por lo que sería suficiente.

Sin embargo, proporcionar control de qué elementos buscar casillas de verificación puede lograrse de muchas maneras, demasiados para entrar en detalles, pero los ejemplos podrían ser document.getElementById (id) .getElementsByTagName si todas las casillas a controlar son nodos ramificados de un elemento .
De lo contrario, puede repetir una recuperación de nombre de etiqueta/recuperación de nombre de clase personalizado para nombrar unos pocos.

Fuente

2011-08-30 23:57:51 Psyrus

este lo hizo gracias.Pero para cumplir mis propósitos, elimino toda la sentencia if y la reemplacé por cbs [i] .checked = bx.checked? verdadero Falso; para que sea un interruptor de palanca – Bastiat

Este código solo sirve para un botón. Si la persona desmarca la casilla, no desmarcará todas sus casillas de verificación. – vol7ron

@ vol7ron tu respuesta no fue cuando escogí la suya. sí, fue una respuesta situacional directa y si nota mi respuesta, reemplacé el código para activar la casilla de verificación. – Bastiat

nombre de la etiqueta es la parte que inicia la etiqueta html por ejemplo <input por lo que el .getElementsByTagName ("link") debe ser .getElementsByTagName ("input") si sólo desea que el name='link' continuación if(bxs.name =="link") { ... change the checked }

Fuente

2011-08-30 23:57:17

Si el OP fue realmente después enlaces, entonces el [documento .links] (http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-7068919) colección sería una mejor opción que * getElementsByTagName * ya que solo obtiene enlaces, no A elementos que podrían ser anclajes. – RobG

Ejemplo: http://jsfiddle.net/vol7ron/kMBcW/

function checkPage(bx){     
    for (var tbls=document.getElementsByTagName("table"), i=tbls.length; i--;) 
     for (var bxs=tbls[i].getElementsByTagName("input"), j=bxs.length; j--;) 
     if (bxs[j].type=="checkbox") 
      bxs[j].checked = bx.checked; 
}

Fuente

2011-08-31 00:02:42 vol7ron

Ha intentado jQuery? Se está convirtiendo en una biblioteca estándar de JavaScript para la manipulación DOM (stackoverflow también).

Con él puede hacer $ (': checkbox'). Prop ('checked', true); para marcar todas las casillas de verificación en la página (pero es probable que no quieras comprobarlas solo en la tabla).

Bueno, de todos modos, comience a usar jQuery, hará que su vida sea más fácil y más feliz, y le ahorrará mucho tiempo.

Fuente

2011-08-31 00:03:53 grisevg

... o incluso más simple si se quiere voltear todas las casillas de verificación en el formulario correspondiente:

function checkAll(bx){ 
    var form = bx.form; 
    var ischecked = bx.checked; 
    for (var i = 0; i < form.length; ++i) { 
     if (form[i].type == 'checkbox') { 
      form[i].checked = ischecked; 
     } 
    } 
}

...

<input type="checkbox" onclick="checkAll(this)">

Fuente

2015-07-20 18:42:39 Zrin

javascript seleccionar todas las casillas de verificación en una tabla

Respuesta

Cuestiones relacionadas