, gizli satırlar da dahil olmak üzere, DataTable'daki tüm onay kutularını işaretler

Question

Gizli satırlar dahil, DataTable'daki tüm onay kutularını denetleyen bir işlev yapmaya çalışıyorum. İşte "checkbox" sütununda html kod:

<div class="usersTable" id="userTable"> 
    <table cellpadding="0" cellspacing="0" id="customersList" > 
     <thead> 
      <tr> 
       <th><input type="checkbox" name="selectall" id="selectall" class="selectall"/></th> 
       <th width="200">val1</th> 
       <th width="80px">val2</th> 
       <th width="70px">val3</th> 
       <th width="450">val4</th> 
       <th width="60px">val5</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td></td> 
       <td></td> 
       <td></td> 
       <td></td> 
       <td></td> 
       <td></td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

düğmesi Gönder:

<input type='button' value='select all' id='selectallboxes' name='selectallboxes' /> 

Ve JQuery kod çalışmaz:

$(function() {   
    otable = $('#customersList').dataTable({ 
     "bJQueryUI": true, 
     "sPaginationType": "full_numbers", 
     "aLengthMenu" : [ [10,20,50,100,1000], [10,20,50,100,1000] ], 
     "iDisplayLength": 100, 
     "bProcessing": true, 
     "bServerSide": true, 
     "aaSorting":[],   
     "iDisplayStart": 0, 
     "sAjaxSource": "filename", 
     .... 

$("#selectallboxes").click (function() { 
     alert(dt.fnGetNodes().length + ' is total number') 
     var selected = new Array(); 
     $('input', dt.fnGetNodes()).each(function() { 
       $(this).attr('checked','checked'); 
       selected.push($(this).val());      
     }); 
     // convert to a string 
     var mystring = selected.length; 
     alert(mystring); 
}) 

Answer 1

Ok, bu nedenle bu Yaptığınız şey olmalı, bu tüm geçerli sayfa <tr>'ları bulacaktır ve bunları dataTables _ API kullanarak döngüsel olarak gösterecektir. Filtreyi, istediğiniz gibi farklı satırları seçmek için ihtiyaçlarınıza uyacak şekilde değiştirebilirsiniz; bu, hepsi de datatable belgelerinde belgelenmiştir.

$("#selectallboxes").click (function() 
{ 
    var selected = new Array(); 

    // Use the _ function instead to filter the rows to the visible 
    var data = oTable._('tr', {"filter":"applied"}); 

    $.each(data, function(key, index) 
    { 
     var input = $(this).find('input[type="checkbox"]'); 

     input.attr('checked', 'checked'); 

     selected.push(input.val()); 
    }); 

    // convert to a string 
    var mystring = selected.length; 

    alert(mystring); 
}); 

Answer 2

Dene:

$("#selectallboxes").click(function() { 
    var selected = new Array(); 
    $(otable.fnGetNodes()).find(':checkbox').each(function() { 
     $this = $(this); 
     $this.attr('checked', 'checked'); 
     selected.push($this.val()); 
    }); 
    // convert to a string 
    var mystring = selected.join(); 
    alert(mystring); 
}); 

.length size dizinin uzunluğunu verir. Diziyi bir dizeye eklemek için join() kullandım. DataTable'ın .fnGetNodes(), gizli olanları içeren tablodaki tüm satırları size verir.

Answer 3

deneyin şey

gibi

$("#selectallboxes").click (function() { 
    var selected = []; 
    $('input:checkbox', otable).each(function() { 
     selected.push($(this).prop('checked', true).val());      
    }); 
    // convert to a string 
    alert(selected.join()); 
}) 

Answer 4

fnGetNodes() orada nedeniyle sayfalama fnGetHiddenNodes() için gizli satırları almak için bir uzantısıdır, ama bu jquery datatable sürümü ile çalışacak, görünür satırları verecek 1.9, jquery datatable 1.10 için aynı güncelleme var ama bu çalışmıyor. ajax isteğinden alınan verilerinizi bir dizide saklayabilir ve ardından onay kutusu tıklatma olayının durumuna göre tabloyu seçili öznitelikte veri ve giriş (onay kutusu) ile yeniden çizebilirsiniz.