Utilisation de JQuery pour vérifier si aucun bouton radio dans un groupe n'a été coché

107

Je suis assis avec un problème, je dois vérifier avec JQuery si aucun bouton radio dans un groupe de boutons radio n'a été coché, afin que je puisse donner aux utilisateurs une erreur javascript s'ils ont oublié de cocher une option.

J'utilise le code suivant pour obtenir les valeurs

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

Réponses:

146
if (!$("input[name='html_elements']:checked").val()) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}
Dominic Rodger
la source
17
Cela échouera si le bouton radio coché a une valeur = ""
ScottE
1
@ScottE - excellent point - je supprimerai cette réponse si Roland ne l'accepte pas.
Dominic Rodger
Je pense que vous pouvez simplement le changer .val() == ""et le supprimer !et vous serez prêt.
Doug Neiner
@Doug - cela n'aurait-il pas encore le problème mentionné par ScottE? Que .val()reviendrait si le bouton radio coché avait value=""? (Bien que je suppose que vous pourriez soutenir que c'est un cas assez improbable).
Dominic Rodger
1
Désolé, mon commentaire était déroutant: je voulais que tout le test ressemble à ceci: if ($("input[name='html_elements']:checked").val() == "")ce qui alerterait "Rien n'est vérifié"
Doug Neiner
144

j'utilise

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

Et retournera FALSE si tous les éléments du radiogroup sont décochés et TRUE si un élément est coché.

Jacobo Hernández
la source
3
Cette réponse a fonctionné pour moi de manière fiable pour vérifier si un groupe de boutons radio avait une valeur sélectionnée. Meilleure réponse dans le fil.
Andy Cook
1
Les réponses de Dominic Rodger et Jacobo Hernández fonctionnent bien. J'essaie personnellement de ne jamais utiliser le premier NOT (!) Au début de la ligne. Des années plus tard, il devient difficile de déboguer lorsque vous oubliez cela et que vous avez la logique à l'envers ... est (": vérifié") ce que vous faites est très clair - Meilleure réponse.
Scott
32

Vous pouvez faire quelque chose comme ceci:

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();
}
Doug Neiner
la source
2
Ne pourriez-vous pas réduire les deux premières lignes à juste if ($("input[name='html_elements']:checked").length == 0){?
Powerlord
7
Vous pourriez, mais vous auriez besoin d'une autre sélection jQuery complète pour obtenir la valeur si vous montriez qu'une valeur existait.
Doug Neiner
5
if ($("input[name='html_elements']:checked").size()==0) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}
fanjabi
la source
2
var len = $('#your_form_id input:radio:checked').length;
      if (!len) {
        alert("None checked");
      };
      alert("checked: "+ len);
David Okwii
la source
2

Je pense que c'est un exemple simple, comment vérifier si une radio dans un groupe de radios a été vérifiée.

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

J'utilise ce très simple

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>

SCÉNARIO

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

}

Mathew Magante
la source