Как выбрать записи в таблице данных jquery pagination

Question

Привет, я пытаюсь отправить все записи с помощью таблицы данных jquery, когда я нажимаю кнопку «Выбрать все (гиперссылку)», или я хочу, чтобы определенные записи на определенных страницах (с использованием флажка) в класс сервера но проблема заключается в том, когда я нажимаю кнопку отправки формы. Экспортируя PDF, я получаю только записи с текущей страницы, даже если записи, выбранные на других страницах в таблице данных jquery pagination

Почему выбранные записи на разных страницах таблицы данных jquery не являются направляется в категорию java

https://jsfiddle.net/4n5o3r3e/

<s:form id="downloadStudentDetailsForm" action="downloadStudentDetails" theme="css_xhtml" cssClass="form-horizontal"> 

<div class="dataTable_wrapper"> 
<table width="100%" class="table table-striped table-bordered table-hover" id="dataTS"> 
<thead> 
<tr> 
<th><a href="#" id="bas">Select all</a></th> 
<th>Student Name</th> 
<th>Parent Phone</th> 
<th>Parent Email</th>              
<th>ReferenceID</th> 
</tr> 
</thead> 
<tbody> 
<s:iterator value="studentRecords"> 
<tr> 
<td><s:checkbox name="students" cssClass="case chkPassport" fieldValue="%{studentname+' '+phone+' '+email+' '+ref}" /></td>                
<td><s:property value="studentname" /></td> 
<td><s:property value="phone" /></td> 
<td><s:property value="email"></td>               
<td><s:property value="ref" /></td> 
</tr> 
</s:iterator> 
</tbody> 
</table> 
</div> 
<div class="col-xs-1 "> 
<s:submit cssClass="btn btn-success" value="Export to Excel" id="exl" action="downloadStudentsListINExcel" /> 
</div> 
<div class="col-xs-3 "> 
<s:submit cssClass="btn btn-danger" value="Export to PDF" id="pdf" action="downloadStudentsListInPDF" /> 
</div>            </s:form> 

Answer 1

Я надеюсь, что я правильно понял, вы хотите, чтобы выбрать все строки, при нажатии на кнопку Выделить все и отправить количество выбранных строк на сервер.

Working Demo.

Так что я сделал это (вы выяснить, как отправить счетчик на сервер) с помощью DataTables API:

$(document).ready(function() { 
    var table = $('#example').DataTable(); 

$("#selectall").click(function() { 
    var rows = table.rows({ 'search': 'applied' }).nodes(); 

    debugger; 
    if($('input:checked', rows).length == rows.length){ 
    $('input[type="checkbox"]', rows).prop('checked', false); 
    } 
    else{ 
    $('input[type="checkbox"]', rows).prop('checked', true); 
    } 


$('#dvcount').html($(rows).find("input:checked").length); 

$("body").on("change","input",function() { 

    var rows = table.rows({ 'search': 'applied' }).nodes(); 
    $('#dvcount').html($(rows).find("input:checked").length); 

}); 

    }); 

Answer 2

я пошел о решении по-другому, но я думаю, что выше ответ самый элегантный , Я посмотрел на исходных данных и изменилось:

$(document).ready(function() { 
    let runningTotal = 0; 
    let table = $('#example').DataTable(); 
    $("#selectall").click(function() { 
    if (runningTotal == table.rows().count()) { 
     table.rows().every(function(rowIdx, tableLoop, rowLoop) { 
     let clone = table.row(rowIdx).data().slice(0); 
     clone[[clone.length - 1]] = '<input type="checkbox" class="record">' 
     table.row(rowIdx).data(clone); 
     }); 
    } else { 
     table.rows().every(function(rowIdx, tableLoop, rowLoop) { 
     let clone = table.row(rowIdx).data().slice(0); 
     clone[[clone.length - 1]] = '<input type="checkbox" class="record" checked="checked">' 
     table.row(rowIdx).data(clone); 
     }); 
    } 
    runningTotal = 0; 
    table.rows().every(function(rowIdx, tableLoop, rowLoop) { 
     var data = this.data(); 
     if ($(data[data.length - 1]).prop("checked")) { 
     runningTotal++ 
     } 
    }); 
    $('#dvcount').html(runningTotal); 
    }); 
    $('#example tbody').on("click", ".record", function() { 
    let clone = table.row($(this).closest('tr')).data().slice(0); 
    let checkbox = clone[clone.length - 1]; 
    if ($(checkbox).prop("checked")) { 
     clone[[clone.length - 1]] = '<input type="checkbox" class="record">' 
    } else { 
     clone[[clone.length - 1]] = '<input type="checkbox" class="record" checked="checked">'; 
    } 
    table.row($(this).closest('tr')).data(clone); 
    runningTotal = 0; 
    table.rows().every(function(rowIdx, tableLoop, rowLoop) { 
     var data = this.data(); 
     if ($(data[data.length - 1]).prop("checked")) { 
     runningTotal++ 
     } 
    }); 
    $('#dvcount').html(runningTotal); 
    }); 
    $("#export").on("click", function() { 
    let exportedRows = []; 
    table.rows().every(function(rowIdx, tableLoop, rowLoop) { 
     let data = table.row(rowIdx).data() 
     if ($(data[data.length - 1]).prop("checked")) { 
     exportedRows.push(data.slice(0, -1)); 
     } 
    }); 
    console.log(exportedRows); 
    }); 
}); 

Это working JSFiddle.