comment cocher la case à l'intérieur d'un statut div en utilisant jquery?

Question

<table> 
<tbody> 
    <tr> 
    <td> 
     <span>A_Group</span> 
     <input type="hidden" value="1" id="ContentPlaceHolder1_rptFleet_hiddenFleetID_0" name="ctl00$ContentPlaceHolder1$rptFleet$ctl00$hiddenFleetID"> 
    </td> 
    <td> 
     <span name="chkGroupName"> 
     <input type="checkbox" onclick="jqCheckAll3(ContentPlaceHolder1_rptFleet_chkFleetName_0,1);" name="ctl00$ContentPlaceHolder1$rptFleet$ctl00$chkFleetName" id="ContentPlaceHolder1_rptFleet_chkFleetName_0"> 
     <label for="ContentPlaceHolder1_rptFleet_chkFleetName_0">Select All</label> 
     </span> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <div id="1"><table cellspacing="5" cellpadding="5" id="ContentPlaceHolder1_rptFleet_chkListDevice_0"> 
     <tbody> 
      <tr> 
       <td> 
        <input type="checkbox" value="1" name="ctl00$ContentPlaceHolder1$rptFleet$ctl00$chkListDevice$0" id="ContentPlaceHolder1_rptFleet_chkListDevice_0_0_0"> 
        <label for="ContentPlaceHolder1_rptFleet_chkListDevice_0_0_0">name 2</label> 
       </td> 
       <td> 
        <input type="checkbox" value="2" name="ctl00$ContentPlaceHolder1$rptFleet$ctl00$chkListDevice$1" id="ContentPlaceHolder1_rptFleet_chkListDevice_0_1_0"> 
        <label for="ContentPlaceHolder1_rptFleet_chkListDevice_0_1_0">name 4</label> 
       </td> 
       <td> 
        <input type="checkbox" value="3" name="ctl00$ContentPlaceHolder1$rptFleet$ctl00$chkListDevice$2" id="ContentPlaceHolder1_rptFleet_chkListDevice_0_2_0"> 
        <label for="ContentPlaceHolder1_rptFleet_chkListDevice_0_2_0">name 4</label> 
       </td> 
      </tr> 
     </tbody> 
     </table> 
     </div> 
     </td> 
    </tr> 
    </tbody> 
</table> 


function jqCheckAll3(id, pID) { 
$("#" + pID + " :checkbox").attr('checked', $('#' + id).is(':checked')); 
} 

Je voudrais cocher/décocher toutes les cases à l'intérieur div = 1 lorsque l'utilisateur a cliqué sur la case sélectionner tous

Answer 1

Vos identifiants doivent être cités, ceci:

onclick="jqCheckAll3(ContentPlaceHolder1_rptFleet_chkFleetName_0,1); 

doit être:

onclick="jqCheckAll3('ContentPlaceHolder1_rptFleet_chkFleetName_0', '1'); 

Il existe d'autres problèmes, comme id="1" n'est pas valide en HTML4, mais l'absence de guillemets provoquant une erreur de script est votre problème actuel.

---

Une façon plus simple dans son ensemble se donner cette case à cocher une classe au lieu via CssClass, comme class="checkAll", vous pouvez le faire:

<script type="text/javascript"> 
$(function() { 
    $("input.checkAll").change(function() { 
    $(this).closest("tr").next().find(":checkbox").attr("checked", this.checked); 
    }); 
}); 
</script> 

Ensuite, celui-ci ensemble de code fonctionne pour toutes ces situations dans la page (en supposant que le balisage/la mise en page est la même).

Answer 2

Je voudrais mettre cela ensemble un peu différemment. Si je comprends votre problème, vous essayez soit de cocher toutes les cases ou de décocher toutes les cases en fonction d'une seule case à cocher (le sélectionner tous). Tout d'abord, comme Nick l'a souligné, vous ne devriez pas utiliser "1" comme ID pour la div. et vous pouvez également utiliser une seule instruction de sélection pour obtenir toutes les cases qui sont un enfant de tout div comme ça ...

//notice I changed the name of the div to myDiv 
var isChecked = $(this).attr('checked'); 
$('#myDiv input:checkbox').attr('checked', isChecked); 

spécifique Ceci affecte le div id, puis par toutes les entrées qui sont des cases à cocher. Je reçois la valeur cochée de la case à cocher "Sélectionner tout" (appelée dans l'événement onClick) et utilise cette valeur pour définir les valeurs des cases à cocher.

Je déplacerais également le câblage de l'événement à l'événement document.ready au lieu de faire l'appel de fonction dans le balisage, mais c'est juste plus de préférence.

Voici un lien vers tout ce travail dans un jsfiddle

espoir cette aide ...