Sélection en bloc de cases à cocher par table en utilisant javascript et PHP

Question

J'essaye de faire une fonction d'action en masse.

Ce que je veux:
- Sélection en vrac dans plusieurs tables, mais <form>
- A chaque table une boîte de sélection pour sélectionner tous les éléments à l'intérieur de cette table

Exemple de mon code

<form method="post"> 
    <table class="list1"> 
    <tbody> 
     <tr> 
      <td class="bulkCheckbox nummer"> 
      <input type="checkbox" 
      name="checkProducts" onclick="checkAll('list1, this')" /> 
      </td> 
     </tr> 
     <tr> 
     <td> 
      <input class="bulkCheckbox" type="checkbox" 
      name="bulkCheckProduct[]" value="2810" /> 
     </td> 
     <td> 
      <input class="bulkCheckbox" type="checkbox" 
      name="bulkCheckProduct[]" value="2811" /> 
     </td> 
     </tr> 
    </tbody> 
    </table> 

    <table class="list2"> 
    <tbody> 
     <tr> 
      <td class="bulkCheckbox nummer"> 
      <input type="checkbox" 
      name="checkProducts" onclick="checkAll('list2, this')" /> 
      </td> 
     </tr> 
     <tr> 
     <td> 
      <input class="bulkCheckbox" type="checkbox" 
      name="bulkCheckProduct[]" value="2812" /> 
     </td> 
     <td> 
      <input class="bulkCheckbox" type="checkbox" 
      name="bulkCheckProduct[]" value="2813" /> 
     </td> 
     </tr> 
    </tbody> 
    </table> 
</form> 



<script> 
function checkAll(table, bx) { 

    var checkname = document.table.getElementsByClassName("bulkCheckbox"); 

    for (i = checkname.length; i--;) { 
     checkname[i].checked = bx.checked; 
    } 
} 
</script> 

Maintenant, j'ai la partie php fonctionné, donc quand je sélectionne plusieurs boîtes de sélection, le $ _POST renvoie mes valeurs.
Aussi la partie Javascript a fonctionné pour moi, alors cochez toutes les cases par table.
Mais Javascript et PHP ensemble ne fonctionnera pas pour moi ..

Comment puis-je résoudre ce problème pour laisser le JS et PHP travailler ensemble?
J'ai essayé plusieurs scripts mais aucun d'entre eux n'a fonctionné pour moi.

L'erreur que je reçois de JS:

Uncaught TypeError: Cannot read property 'getElementsByName' of undefined 

Ce que je cherche, rien ne marche ..

Answer 1

Essayez le code ci-dessous

 
function checkAll(table, bx) { 
 

 
    var checkname = document.getElementsByClassName("bulkCheckbox"); 
 

 
    for (i = checkname.length; i--;) { 
 
\t \t console.log(checkname[i]); 
 
\t \t console.log(bx); 
 
     checkname[i].checked = bx.checked; 
 
    } 
 
} 
 

<form method="post"> 
 
    <table class="list1"> 
 
    <tbody> 
 
     <tr> 
 
      <td class="bulkCheckbox nummer"> 
 
      <input type="checkbox" 
 
      name="checkProducts" onclick="checkAll('list1', this)" /> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
     <td> 
 
      <input class="bulkCheckbox" type="checkbox" 
 
      name="bulkCheckProduct[]" value="2810" /> 
 
     </td> 
 
     <td> 
 
      <input class="bulkCheckbox" type="checkbox" 
 
      name="bulkCheckProduct[]" value="2811" /> 
 
     </td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 

 
    <table class="list2"> 
 
    <tbody> 
 
     <tr> 
 
      <td class="bulkCheckbox nummer"> 
 
      <input type="checkbox" 
 
      name="checkProducts" onclick="checkAll('list2', this)" /> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
     <td> 
 
      <input class="bulkCheckbox" type="checkbox" 
 
      name="bulkCheckProduct[]" value="2812" /> 
 
     </td> 
 
     <td> 
 
      <input class="bulkCheckbox" type="checkbox" 
 
      name="bulkCheckProduct[]" value="2813" /> 
 
     </td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</form>

'this' le paramètre que vous passez dans checkAll() est passé en tant que chaîne.