Bouton Activer / Désactiver en fonction du nombre de cases cochées multiples avec des identifiants différents - javascript, jquery, asp.net, gridview

J'ai une liste de cases à cocher dans un tableau comme celui-ci avec un bouton: -

<table id="mytable">
<tr><th>checked</th><th>id</th><th>text</th></tr>
<tr><td><input id="cb1" type="checkbox" name="checker1"/></td><td>123</td><td>abc</td></tr>
<tr><td><input id="cb2" type="checkbox" name="checker2"/></td><td>456</td><td>def</td></tr>
<tr><td><input id="cb3" type="checkbox" name="checker3"/></td><td>789</td><td>ghi</td></tr>
<tr><td><input id="cb4" type="checkbox" name="checker4"/></td><td>454</td><td>ghi</td></tr>
<tr><td><input id="cb5" type="checkbox" name="checker5"/></td><td>565</td><td>ghi</td></tr>
</table>

<input type="button" name="myjqbutton" value="My Jquery Button" id="jqb" disabled="true"/>

Ce que je veux faire est d’activer le bouton si 1 ou plusieurs cases à cocher sont cochées.

Les idées initiales sont que je dois compter le nombre de cases cochées dans le tableau. Je peux le faire en utilisant un .each pour les compter dans une variable.

var mytable= document.getElementById("mytable");
$("input:checkbox:checked", mytable).each(function() {
// whatever here
});

Cependant, chaque case à cocher nécessitera un événement modifié pour vérifier le nombre et activer ou désactiver le bouton, selon que nombre> 0 ou non.

Ou existe-t-il un moyen plus simple d’atteindre cette fonctionnalité que je recherche?

Réponses:

Vous pourriez faire

$("#mytable input:checkbox").change(function(){
$("#jqb").prop("disabled", $("#mytable input:checkbox:checked").length ===0);
});

Il peut faire ce que tu veux:

$("#mytable input[type=checkbox]").click(function(){
if($("#mytable input[type=checkbox]:selected").size()) > 0) $("#jqb").attr("disabled", "disabled");
else $(".someElement").removeAttr("disabled");

if ($("#mytable :checkbox:checked").length) {
$("#jqb").prop("disabled", false); // Assumes disabled by default
}

Essaye celui-là;

 $("#jqb").prop("disabled", $("#mytable input:checkbox:checked"]").length === 0);

change event est un must, mais jQuery fournit un sélecteur complexe pour réduire le nombre de tâches à compter:

$(":checkbox").change(function(e) {
// for a performance considerationg, to reduce selector lookup,
// once a checkbox is checked itself, there must be one or more checkbox checked
// then the selector finds checked checkbox whose id attribute starts with "cb"
if (this.checked || $(":checkbox[id^="cb"]:checked).length >= 1) {
// do stuff
}
});