jQuery voir si une ou aucune case à cocher n'est cochée

126

Je sais comment voir si une case individuelle est cochée ou non.

Mais j'ai des problèmes avec ce qui suit - étant donné un identifiant de formulaire, j'ai besoin de voir si l' une des cases à cocher est cochée (c'est-à-dire 1 ou plus), et j'ai besoin de voir si aucune n'est sélectionnée. Fondamentalement, j'ai besoin de deux fonctions distinctes qui répondent à ces deux questions. Une aide serait appréciée. Merci!

En fait, j'aurais juste besoin d'une fonction pour me dire si aucune n'est sélectionnée. Sachant cela répondrait à l'autre question.

bba
la source

Réponses:

246

Vous pouvez utiliser quelque chose comme ça

if ($("#formID input:checkbox:checked").length > 0)
{
    // any one is checked
}
else
{
   // none is checked
}
rahul
la source
8
$("#formID input:checkbox:checked").lengthserait suffisant ici aussi
Damon
@Damon Je suppose que vous vouliez dire que if ($("#formID input:checkbox:checked").length){}(sans le >0) serait suffisant car 0 est une valeur fausse, voir james.padolsey.com/javascript/truthy-falsey
Adrien Be
11
jQuery dit à propos du :checkboxsélecteur :,For better performance in modern browsers, use [type="checkbox"] voir api.jquery.com/checkbox-selector - idem pour radiobuttons btw, use [type="radio"] rather than :radio api.jquery.com/radio-selector
Adrien Be
27

JQuery .istestera tous les éléments spécifiés et retournera true si au moins l'un d'entre eux correspond au sélecteur:

if ($(":checkbox[name='choices']", form).is(":checked"))
{
    // one or more checked
}
else
{
    // nothing checked
}
Michael Logutov
la source
Bien que cela is()semble fonctionner, avoir :checkeddirectement dans le sélecteur comme indiqué dans la réponse de @ rahul semble plus approprié. is () semble plus utile lors de "rappels internes", voir api.jquery.com/is . Ou est-ce que je manque quelque chose?
Adrien Be
Non, c'est à peu près ce qui est écrit dans les documents - vous vérifiez si un élément correspond à l'attribut spécifié. Appliquer c'est comme filtre, puis vérifier si vous obtenez au moins un élément dans le résultat est le même mais je suis plus long et pas si expressif.
Michael Logutov
+1 pour le fait que .is(":checked")dans votre solution est plus expressif, pas sûr du reste cependant.
Adrien Be
À savoir $("form input[type=checkbox]").is(":checked")pourrait être une approche plus simple et plus générique.
Adrien Be
@AdrienBe Using ispourrait être de meilleures performances, car il s'arrête dès qu'il en trouve un.
ChrisW
8

Tu peux le faire:

  if ($('#form_id :checkbox:checked').length > 0){
    // one or more checkboxes are checked
  }
  else{
   // no checkboxes are checked
  }

Où:

  • :checkbox le sélecteur de filtre coche toutes les cases.
  • :checked sélectionnera les cases cochées
  • length donnera le nombre de vérifiés là-bas
Sarfraz
la source
jQuery dit à propos du :checkboxsélecteur :,For better performance in modern browsers, use [type="checkbox"] voir api.jquery.com/checkbox-selector
Adrien Be
6

C'est ce que j'ai utilisé pour vérifier si des cases à cocher dans une liste de cases à cocher avaient changé:

$('input[type="checkbox"]').change(function(){ 

        var itemName = $('select option:selected').text();  

         //Do something.

});     
James Drinkard
la source
6

Sans utiliser 'length', vous pouvez le faire comme ceci:

if ($('input[type=checkbox]').is(":checked")) {
      //any one is checked
}
else {
//none is checked
}
Acheme Paul
la source
3

Vous pouvez faire un simple retour de .lengthici:

function areAnyChecked(formID) {
  return !!$('#'+formID+' input[type=checkbox]:checked').length;
}

Cette recherche de cases à cocher dans la forme donnée, voit s'il y en a :checkedet renvoie truesi elles le sont (puisque la longueur serait 0 sinon). Pour rendre les choses un peu plus claires, voici la version convertie non booléenne:

function howManyAreChecked(formID) {
  return $('#'+formID+' input[type=checkbox]:checked').length;
}

Cela renverrait un décompte du nombre de vérifications.

Nick Craver
la source
3

La réponse de Rahul est la mieux adaptée à votre question. Quoi qu'il en soit, si vous avez un groupe de cases à cocher à cocher et pas toutes les cases à cocher dans votre formulaire, vous pouvez y aller.

Mettez un nom de classe pour toutes les cases à cocher que vous souhaitez cocher, par exemple un nom de classe test_checket maintenant vous pouvez vérifier si l'une des cases à cocher est cochée appartenant au groupe en:

$("#formID .test_check:checked").length > 0

S'il retourne true, supposons qu'une ou plusieurs cases à cocher sont cochées avec le nom de la classe test_checket aucune cochée si retourne false.

J'espère que ça aide quelqu'un. Merci :)-

Rajesh Omanakuttan
la source
1

C'est la meilleure façon de résoudre ce problème.

  if($("#checkbox").is(":checked")){

  // Do something here /////

  };
Asiamah Amos
la source
Salut, bienvenue dans StackOverflow. Peut-être pourriez-vous décrire votre réponse un peu plus, car on ne voit pas pourquoi c'est la «meilleure façon» de résoudre le problème.
dddJewelsbbb le