Usando JQuery para verificar se nenhum botão de opção em um grupo foi verificado


107

Estou tendo um problema. Preciso verificar com o JQuery se nenhum botão de opção em um grupo de botões de opção foi verificado, para que eu possa dar aos usuários um erro de javascript se eles se esquecerem de marcar uma opção.

Estou usando o seguinte código para obter os valores

var radio_button_val = $("input[name='html_elements']:checked").val();

Respostas:


146
if (!$("input[name='html_elements']:checked").val()) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}

17
Isso falhará se o botão de opção selecionado tiver um valor = ""
ScottE

1
@ScottE - excelente ponto - removerei esta resposta se Roland não aceitar.
Dominic Rodger

Acho que você poderia apenas alterá-lo para .val() == ""e remover o !e tudo estaria pronto.
Doug Neiner

@Doug - isso ainda não teria o problema que ScottE mencionou? O que .val()retornaria se o botão de opção marcado tivesse value=""? (Embora eu suponha que você possa argumentar que é um caso bastante improvável).
Dominic Rodger

1
Desculpe, meu comentário foi confuso: eu pretendia que todo o teste if ($("input[name='html_elements']:checked").val() == "")ficasse assim: o que alertaria "Nada foi verificado"
Doug Neiner

144

estou a usar

$("input:radio[name='html_radio']").is(":checked")

E retornará FALSE se todos os itens no grupo de rádio estiverem desmarcados e TRUE se um item estiver marcado.


3
Esta resposta funcionou para mim de forma confiável para verificar se um grupo de botões de opção tinha um valor selecionado. Melhor resposta do tópico.
Andy Cook

1
Ambas as respostas de Dominic Rodger e Jacobo Hernández funcionam bem. Eu pessoalmente tento nunca usar o NOT (!) Inicial no início da linha. Anos depois, fica difícil depurar quando você ignora isso e tem a lógica invertida ... is (": verificado") é muito claro o que você está fazendo - Melhor resposta.
Scott

32

Você poderia fazer algo assim:

var radio_buttons = $("input[name='html_elements']");
if( radio_buttons.filter(':checked').length == 0){
  // None checked
} else {
  // If you need to use the result you can do so without
  // another (costly) jQuery selector call:
  var val = radio_buttons.val();
}

2
Você não poderia estreitar as duas primeiras linhas para apenas if ($("input[name='html_elements']:checked").length == 0){?
Powerlord de

7
Você poderia, mas então precisaria de outra seleção completa do jQuery para obter o valor se mostrasse que existe um valor.
Doug Neiner

5
if ($("input[name='html_elements']:checked").size()==0) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}


2
var len = $('#your_form_id input:radio:checked').length;
      if (!len) {
        alert("None checked");
      };
      alert("checked: "+ len);

2

Acho que este é um exemplo simples, como verificar se um rádio em um grupo de rádios foi verificado.

if($('input[name=html_elements]:checked').length){
    //a radio button was checked
}else{
    //there was no radio button checked
} 

0

Estou usando isso muito simples

HTML

<label class="radio"><input id="job1" type="radio" name="job" value="1" checked>New Job</label>
<label class="radio"><input id="job2" type="radio" name="job" value="2">Updating Job</label>


<button type="button" class="btn btn-primary" onclick="save();">Save</button>

ROTEIRO

 $('#save').on('click', function(e) {
    if (job1.checked)
        {
              alert("New Job"); 
        }
if (job2.checked)
        {
            alert("Updating Job");
        }

}

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.