sexta-feira, 29 de fevereiro de 2008

Validar checkbox com JavaScript

Este script valida checkbox gerados dinamicamente, com nomes diferentes.

function validaCheckbox(v)
{
todos = document.getElementsByTagName('input');
for(x = 0; x < todos.length; x++)
{
if (todos[x].checked)
{
return true;
}
}
alert("Selecione pelo menos um item!");
return false;
}
Na chamada do formulário <form [...] > basta colocar onSubmit="return validaCheckbox(this);"
<form action="arquivo.php" method="post" onSubmit="return validaCheckbox(this);">

6 comentários:

Anônimo disse...

Olha... estava justamente procurando isto faz tempo... funcionou beleza aqui... valeu, muito abrigado!

claudio disse...

ola estou montando uma pagina com um formulario com dois botoes, cada um direciona para um link diferente.
como posso usar o javascript colocar 2 botoes no form e ao mesmo tempo validar o chekbox.
tipo assim, o cliente preenche os dados e tem o chekbox de aceito os termos e condicoes, logo abaixo tem um botao pagamento com cartao e outro para pagamento com boleto

Anderson Dias disse...

Claudio,

O que você pode fazer é criar os dois botões do tipo "button" e não "submit". Cada botão chama uma função javascript que será responsável por alterar o action do formulário (direcionando para um link diferente, você pode passar por parâmetro no onClick do botão) e também irá chamar uma função específica para validar o checkbox.

Se for apenas 1 checkbox fica ainda mais fácil. Você cria a mesma função que comentei acima e, ao invés de criar uma função só para validar o checkbox, você valida o checkbox na própria função do botão, usando getElementById e verificando se ele está ou não checado. Algo como:

se checkbox está marcado então
muda o action do form para aceito.html
senão
muda o action do form para rejeitado.html

Não sei se isso atende ao que você precisa, mas qualquer dúvida é só mandar uma mensagem.

Att,
Anderson Dias

claudio disse...

obrigado pela atencao anderson, eu ja consegui fazer os dois botoes en javascript, o q nao consigo é validar os 2 com o checkbox

Leonardo disse...

Obrigado pelo código, me ajudou muito. Porém percebi que você está enviando a id do form, porém não a utiliza na função JS.
Segue uma aperfeiçoamento que fiz do código, que fará distinção dos formulários na hora de validar os checkbox.

function validaCheckbox(v)
{
todos = document.forms[v].getElementsByTagName('input');
for(x = 0; x < todos.length; x++)
{
if (todos[x].checked)
{
return true;
}
}
alert(\"Selecione pelo menos uma opção!\");
return false;
}

No formulário, você apenas deverá passar para dentro da função o número do formulário em questão, para isso basta usar um contador simples:

onSubmit='return validaCheckbox($contador);'

Abraço, parabéns pelo trabalho.

Bruno disse...

Parabéns pelo tutorial, simples e funcional!