문제점 : dataTables javascript 라이브러리를 사용하여 데이터를 완벽하게 표시합니다.Datatables에서 테이블을로드하고로드시 자동으로 마지막 레코드로 스크롤하는 방법
데이터는 PHP/MySQL을 통해 검색 한 후 테이블이 그려지고 같은 테이블을 통해 부호 사이클 : dataTables위한
JAVA 코드 -
<script>
$(document).ready(function() {
$("#PayMasterResults").dataTable({
"sPaginationType": "full_numbers",
"bPaginate": false,
"bJQueryUI" : true,
"sScrollY": "215",
"bLengthChange": true,
"bFilter": true,
"bSort": false,
"bInfo": true,
"bAutoWidth": false,
"sDom": \'<"H"lTfr>t<"F"ip>\',
"oTableTools": {
"sSwfPath": "lib/copy_csv_xls_pdf.swf",
"sRowSelect": "multi",
"aButtons": [
"print",
{
"sExtends": "copy",
"sButtonText": "Copy to clipboard"
},
{
"sExtends": "csv",
"sButtonText": "Export CSV"
},
{
"sExtends": "xls",
"sButtonText": "Save for Excel"
},
{
"sExtends": "pdf",
"sButtonText": "Save to PDF",
"sPdfOrientation": "landscape",
}
]
}
});
});
</script>
HTML/PHP -
<div class="table">
<table class="display" id="PayMasterResults">
<thead>
<tr>
<th class="" width="600px"><b>Entry Description</b></th>
<th class=""><b>Entry Timestamp</b></th>
<th class=""><b>Debit/Credit</b></th>
<th class=""><b>Running Balance</b></th>
</tr>
</thead>
<tbody>
';
for($x=0; $x<$xmldata->Ledger->count(); $x++) {
echo '
<tr class="gradeB">
<td><a href="#" onclick="loadPMLedgerDetail(\''.$xmldata->Ledger[$x]->attributes()->ID.'\',\''.$_POST['ID'].'\');">'.$xmldata->Ledger[$x]->Description.'</a></td>
<td>'.$xmldata->Ledger[$x]->Stamp.'</td>
<Td>'.$xmldata->Ledger[$x]->Amount.'</td>
<td>'.$xmldata->Ledger[$x]->Balance.'</td>
</tr>
';
}
echo '
</tbody>
</table>
</div> <!-- End Table -->
-
문제는 테이블에 현재 모든 데이터가 표시됩니다. 사용자가 원하는 경우 사용자가 아래로 스크롤 할 수 있으며 테이블 아래쪽에 스크롤 막대가 있어야합니다. 그래서 사용자는 위로 스크롤 할 수 있지만 아래로 스크롤 할 수는 없습니다.
jquery scrollTop을 시도했지만 작동하지 않아 succesflly이 작업을 수행하는 예제를 찾을 수 없습니다.
- 시도 # 2 추천 후 - 당신이 Scroller extra를 사용하는 경우
는운 불행하게도 아직
<script>
$(document).ready(function() {
var myTable = $("#PMLedgerDetailsTable").dataTable({
"sPaginationType": "full_numbers",
"aaSorting": [[ 0, "asc" ]],
"bPaginate": true,
"bJQueryUI" : true,
"sScrollY": "215",
"bLengthChange": true,
"bFilter": true,
"bSort": false,
"bInfo": true,
"bAutoWidth": false,
"sDom": \'<"H"lTfr>t<"F"ip>S\',
"oTableTools": {
"sSwfPath": "lib/copy_csv_xls_pdf.swf",
"sRowSelect": "multi",
"aButtons": [
"print",
{
"sExtends": "copy",
"sButtonText": "Copy to clipboard"
},
{
"sExtends": "csv",
"sButtonText": "Export CSV"
},
{
"sExtends": "xls",
"sButtonText": "Save for Excel"
},
{
"sExtends": "pdf",
"sButtonText": "Save to PDF",
"sPdfOrientation": "landscape",
}
]
},
"fnInitComplete" : function() {
myTable.fnSettings().oScroller.fnScrollToRow(10000);
}
});
});
</script>
행운
는 ..
행운이, 내가 당신의 코멘트 – user1648968
아하 후 시도 것을 보여주기 위해 원래의 질문을 편집 한! 신참 오류, 나는 dataTables.scroller.min.js를 포함하지 않았다 !!! 일단 코드가 포함되면 – user1648968