jQuery - alternar seleccionar todas las casillas de verificación

Question

luchado con un montón de ejemplos y, siendo todavía nuevo en jQuery/Javascript, no puede conseguir mi código para funcionar (en este caso mi mi plantilla en gsp):

<table> 
    <thead> 
    <tr> 
     <th><input type="checkbox" name="selectAll" onclick="selectAll(this.checked);"/></th> 
    </tr> 
    </thead> 
    <tbody> 
     <td> 
      <td><input type="checkbox" name="domainList" value="${domainInstance.id}"/></td> 
    </tbody> 
<table> 

tengo el fragmento de JavaScript siguiente en mi gsp principal, que llama a la plantilla:

function selectAll(status) { 

} 

¿Cómo seleccionar todas las casillas de verificación del nombre selectAll?

Answer 1

dado que está utilizando jQuery, se debe utilizar un controlador onclick, como a continuación para selectAll.

$(':checkbox[name=selectAll]').click (function() { 
    $(':checkbox[name=domainList]').prop('checked', this.checked); 
}); 

Tenga en cuenta que el código anterior se va a ver en todo el dom de la casilla con name=selectAll y establecer el estado de la casilla de verificación con name=domainList.

A continuación se muestra una versión ligeramente mejor con el cambio de marcas de menor importancia,

jsFiddle DEMO

$('#selectAllDomainList').click(function() { 
 
    var checkedStatus = this.checked; 
 
    $('#domainTable tbody tr').find('td:first :checkbox').each(function() { 
 
    $(this).prop('checked', checkedStatus); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<table id="domainTable"> 
 
    <!-- Added ID --> 
 
    <thead> 
 
    <tr> 
 
     <th> 
 
     <!-- Added ID to below select box --> 
 
     <input type="checkbox" name="selectAll" id="selectAllDomainList" /> 
 
     </th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" name="domainList" value="${domainInstance.id}" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" name="domainList" value="${domainInstance.id}" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" name="domainList" value="${domainInstance.id}" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     <input type="checkbox" name="domainList" value="${domainInstance.id}" /> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
    <table>

Answer 2

$("input:checkbox").prop("checked", status); 

Answer 3

para seleccionar todas las casillas de verificación con el nombre = selectAll y determinado su estado que puede hacer

function selectAll(status) { 
    $('input[name=selectAll]').each(function(){ 
     $(this).prop('checked', status); 
    }); 
}