Eu tenho dois botões de rádio dentro de um formulário HTML. Uma caixa de diálogo aparece quando um dos campos é nulo. Como posso verificar se um botão de rádio está seleccionado?
Deixe's fingir que você tem HTML como este
<input type="radio" name="gender" id="gender_Male" value="Male" />
<input type="radio" name="gender" id="gender_Female" value="Female" />
Para validação do lado do cliente, aqui's algum Javascript para verificar qual deles está selecionado:
if(document.getElementById('gender_Male').checked) {
//Male radio button is checked
}else if(document.getElementById('gender_Female').checked) {
//Female radio button is checked
}
O acima mencionado poderia ser tornado mais eficiente dependendo da natureza exata da sua marcação, mas isso deve ser o suficiente para começar.
Se você'está apenas olhando para ver se qualquer botão de rádio está selecionado qualquer lugar na página, PrototypeJS torna isso muito fácil.
Aqui's uma função que retornará verdadeiro se pelo menos um botão de rádio for selecionado em algum lugar na página. Novamente, isto pode precisar ser ajustado dependendo do seu HTML específico.
function atLeastOneRadio() {
return ($('input[type=radio]:checked').size() > 0);
}
Para validação do lado do servidor (lembre-se, você pode't depender inteiramente do Javascript para validação!), dependeria do seu idioma de escolha, mas você'd mas verificando o valor gender
da string de requisição.
Com jQuery, it'seria algo como
if ($('input[name=gender]:checked').length > 0) {
// do something here
}
Deixem-me partir isso em pedaços para o cobrir mais claramente. jQuery processa as coisas da esquerda para a direita.
input[name=gender]:checked
[name=gênero]
limita-o a tags com o gênero do nome dentro do grupo anterior.:check
limita-o a caixas de seleção/ botões de rádio que são selecionados dentro do grupo anterior.Se você quiser evitar isso completamente, marque um dos botões de rádio como marcado (checked="check"
) no código HTML, o que garantiria que um botão de rádio fosse sempre selecionado.
Um jeito de baunilha JavaScript
var radios = document.getElementsByTagName('input');
var value;
for (var i = 0; i < radios.length; i++) {
if (radios[i].type === 'radio' && radios[i].checked) {
// get value, set checked flag or do whatever you need to
value = radios[i].value;
}
}