Cases à cocher, cocher/décocher par colonnes

Question

<script type="text/javascript"> 
    function marcarJob(source) 
    { 
     checkboxes=document.getElementsByTagName('input'); 
     for(i=0;i<checkboxes.length;i++) 
     { 
      if(checkboxes[i].type == "checkbox") 
      { 
       checkboxes[i].checked=source.checked; 
      } 
     } 
    } 

    function marcarDeproc(source) 
    { 
     checkboxes=document.getElementsByTagName('input'); 
     for(i=0;i<checkboxes.length;i++) //record all controls 
     { 
      if(checkboxes[i].type == "checkbox") 
      { 
       checkboxes[i].checked=source.checked; 
      } 
     } 
    } 

    function marcarEs(source) 
    { 
     checkboxes=document.getElementsByTagName('input'); 
     for(i=0;i<checkboxes.length;i++) 
     { 
      if(checkboxes[i].type == "checkbox") 
      { 
       checkboxes[i].checked=source.checked; // (mark/unmark all) 
      } 
     } 
    } 
</script> 

De la façon dont c'est le cas, lorsque je coche l'une des cases du haut, toutes les cases à cocher sont cochées.

J'ai besoin qu'ils s'allument en colonnes. Si la première est cochée, les autres doivent également être cochées/décochées, ordonnées en colonnes, la première case à cocher d'une colonne est comme un "SELECT ALL" mais uniquement pour la colonne.

Answer 1

Première chose à noter est que vous activez checkbox avec tagName, il trouverait toutes les cases à cocher sur la page.

Vous devez créer des cases à cocher de la colonne unique avec le même nom que ce qui suit:

<input type="checkbox" name="column1_checkAll" onclick="javascript: checkUncheckAll('column1', this);"/> 
<input type="checkbox" name="column1_checkbox" id="chk1" /> 
to 
<input type="checkbox" name="column1_checkbox" id="chkn" /> 

et ajoutez le javascript suivant pour cocher/décocher toutes les cases de la colonne unique.

function checkUncheckAll(columnNo, checkboxObject){ 
    if(checkboxObject){ // Check for null IE 
     var checkStatus = checkboxObject.checked; // CheckAll checked or unchecked status 
     var columnName = columnNo+'_checkbox'; 
     var allCheckboxes = document.getElementsByName(columnName);    

     for(var i= 0; i < allCheckbox.length; i++){ 
      allCheckboxes[i].checked = status; 
     } 
    } 
}