Hola a toda la comunidad Fware que nos sigue, en esta oportunidad voy a mostrar una forma fácil para poder seleccionar o de-seleccionar varios checkbox con jQuery.
Ejemplo:
1. Ahora creamos el código HTML con las llamadas a la librería jQuery y el archivo checks.js, el cual se encargará de la lógica de cambio de los estados de los checkbox.
<html> <head> <script src="/js/jquery.js" type="text/javascript"></script> <script src="/js/checks.js" type="text/javascript"></script> </head> <body> <table> <tr> <th><input type="checkbox" id="checkMain" /></th> <th>Mail</th> <th>Fecha</th> </tr> <tr> <td><input type="checkbox" class="checkAll" /></td> <td>Bienvenido a la Comunidad Fware</td> <td>2012/06/04</td> </tr> <tr> <td><input type="checkbox" class="checkAll" /></td> <td>Mensaje de confirmación</td> <td>2012/06/03</td> </tr> <tr> <td><input type="checkbox" class="checkAll" /></td> <td>Noticias</td> <td>2012/06/02</td> </tr> </table> </body> <html>
2. Para finalizar se debe agregar la lógica al file checks.js
$(function(){
$('#checkMain').live('click',function(){
$('.checkAll').attr('checked',($(this).is(':checked')) ? true:false);
});
});
En esta lógica lo que se está haciendo al hacer click en el checkbox con id checkMain es cambiar el estado del atributo checked de los checkbox que incluyan la clase checkAll a su estado contrario “si es TRUE lo cambiara por FALSE y de forma inversa”.
Para ver el código anterior en funcionamiento visita el siguiente link:
http://jsfiddle.net/neoslink/Z8bmZ/embedded/result/
Espero que sea de gran utilidad, Gracias…
Muy buen aporte, eso era lo que buscaba. gracias
Excelente…!
Gracias!!
Muy bueno, solo que no me funciona, creo que faltan los jquery
saludos