Comment cocher toutes les cases dans le formulaire actuel avec jquery?

Question

Tenir compte de ce simple exemple de code:

<form name="text" id="frm1" method="post"> 
    <input type="checkbox" name="name[]" value="1000"> Chk1<br> 
    <input type="checkbox" name="name[]" value="1001"> Chk2<br> 
    <input type="checkbox" name="name[]" value="1002"> Chk3<br> 
    <input type="checkbox" name="name[]" value="1003"> Chk4<br> 
    <input type="checkbox" id="select_all"/> Select All<br> 
</form> 

<form name="text" id="frm2" method="post"> 
    <input type="checkbox" name="name[]" value="4000"> Chk1<br> 
    <input type="checkbox" name="name[]" value="4001"> Chk2<br> 
    <input type="checkbox" name="name[]" value="4002"> Chk3<br> 
    <input type="checkbox" name="name[]" value="4003"> Chk4<br> 
    <input type="checkbox" id="select_all"/> Select All<br> 

J'essaie d'obtenir Sélectionner tout pour travailler dans chaque forme (formes sont générées dynamiquement dans mon code de production et ont différents, des noms différents)

J'utilise cette jquery mais select_all ne fonctionne que pour le premier formulaire; il n'a pas d'incidence sur les formulaires en dessous du premier. Je n'arrive pas à comprendre comment cocher toutes les cases à cocher dans l'une des cases à cocher contenues dans l'ID du formulaire.

Quelqu'un peut-il me diriger dans la bonne direction?

Un grand merci

Answer 1

Vous avez plusieurs éléments avec le même ID, qui est HTML invalide et est à l'origine du problème que vous voyez. Changez id="select_all" en class="select_all", et $('#select_all') en $('.select_all'), et vous devriez être bon.

Answer 2

Les ID sont uniques. Tu as deux. Si vous voulez plusieurs éléments, utilisez class="select_all" et $('.select_all')

Answer 3

Vous avez deux éléments avec l'ID select_all; ce n'est pas autorisé. Un changement qui à une classe et essayez ceci:

$('.select_all').change(function() { 
    var checkboxes = $(this).closest('form').find(':checkbox'); 
    checkboxes.attr('checked', $(this).is(':checked')); 
}); 

Answer 4

$('#select_all').click(function() { 
    $("input:checkbox", $(this).closest('form')).attr("checked", this.checked) 
}); 

Cependant, vous aurez besoin d'un seul article avec id select_all pour que cela fonctionne. Si vous pouvez passer à une classe de select_all puis remplacez juste le # avec un . et vous êtes bon pour aller

Answer 5

Essayez ceci:

$("#select_all").click(function()    
     { 
      var checked_status = this.checked; 
      $("input[@name=name]").each(function() 
      { 
       this.checked = checked_status; 
      }); 
     }); 

Answer 6

vous ne pouvez pas avoir deux éléments avec le même ID. example

html:

<form name="text" id="frm1" method="post"> 
    <input type="checkbox" name="name[]" value="1000"> Chk1<br> 
    <input type="checkbox" name="name[]" value="1001"> Chk2<br> 
    <input type="checkbox" name="name[]" value="1002"> Chk3<br> 
    <input type="checkbox" name="name[]" value="1003"> Chk4<br> 
    <input type="checkbox" id="select_all_1"/> Select All<br> 
</form> 

<form name="text" id="frm2" method="post"> 
    <input type="checkbox" name="name[]" value="4000"> Chk1<br> 
    <input type="checkbox" name="name[]" value="4001"> Chk2<br> 
    <input type="checkbox" name="name[]" value="4002"> Chk3<br> 
    <input type="checkbox" name="name[]" value="4003"> Chk4<br> 
    <input type="checkbox" id="select_all_2"/> Select All<br> 
</form> 

JS:

$(function() { 

    $('#select_all_1, #select_all_2').bind('click', function(event) { 

     var 
      ref = this, 
      refChecked = this.checked; 

     $(this.form).find('input[type="checkbox"]').each(function(i, el) { 
      if(this != ref) 
       this.checked = refChecked; 
     }); 

    }); 

});