Sabem quando temos uma lista bem grande de <inputs> do tipo checkbox, onde o usuário terá de selecionar quais são as opções desejadas?

Exemplo:

Check1

Bom, agora imaginem que esta lista é um pouco maior. Fica extremamente desagradável ter que marcar ou desmarcar um a um.
Uma boa prática é colocar uma opção para o usuário marcar ou desmarcar todos.

Isso é uma tarefa bem fácil de se implementar em Javascript “puro”, mas o jQuery como sempre nos da aquela ajuda.

Solução:

// Atribuímos a variavel ipts todos os inputs encontrados dentro do elemento "#checkboxes"
var ipts = $("#checkboxes").find("input");

function checkAll()
{
// CheckBox que ao ser clicado marca ou desmarca todos elementos
var check = document.getElementById("checkboxCheckAll");

// Testamos o CheckBox para ver se devemos marcar ou desmarcar
check.checked ?
jQuery.each(ipts, function(){
// Se esta "checado" então marcamos todos elementos como checked=true
this.checked = true;
}) :
jQuery.each(ipts, function(){
// Se não esta "checado" então marcamos todos elementos como checked=false
this.checked = false;
});
}

Simples e rápido.

Testei com mais de 50 elementos e a rotina não ultrapassou 2 milisegundos.

Related Posts:

• No Related Posts

The jQuery Marcar / Desmarcar CheckBoxes by Jaydson Gomes, unless otherwise expressly stated, is licensed under a Creative Commons Attribution 2.5 Brazil License.

subscribe RSS feed!