私はdatatables/bootstrap.yadcfを使用しています。ここでは、データがページされ、ajaxを使用して収集されています。データテーブルの次のボタンが機能していません
var oTable = $('#myTable').DataTable({
pagingType: "full_numbers",
searching: true,
select: true,
lengthChange: false,
pageLength: "10",
scrollY: "550px",
scrollCollapse: true,
processing: true,
language: {
info: "Show _START_ to _END_ from _TOTAL_ (filterded) zoekvragen (Pag. _PAGE_ from _PAGES_)",
infoEmpty: "No data",
emptyTable: "No data",
zeroRecords: "No data",
infoFiltered: " - Total number of zoekvragen: _MAX_",
paginate: {first: "First", last: "Last", next: "Next", previous: "Previous"}
},
serverSide: true,
ajax: {url: '/intakes/ajax', type: 'GET'},
columns: [
{ width: "10%", data: "familienaam", render: function(data, type, row) {return "<a href='/intakes/" + row.zoekvraagId + "'>" + row.familienaam + ' ' + row.voornamen + "</a>";}},
... more columns
]
});
表の下に、選択可能なページが表示されます。 ページをクリックすると、サーバーから正しいデータセットが取得され、ブラウザクライアント(10個のエントリ)に表示されます。 最後に選択して次へを数回押すと、すべて正常に動作します。
最初のページではないページから次のページをクリックしても何も起こらない場合。 Iは、テーブルの下に以下に気づい:926から10に表示1(filterded)zoekvragen 選択されたページ2:
選択されたページ1(PAG 1 93から。):ショー11を926に926から(filterded )zoekvragen(ページ93から2) 選択したページ3:926から21926を表示(フィルタ付き)zoekvragen(ページ3から93)
最後は不思議です。そこに示す10件のエントリがあり、1つは、 "(93からパグ3。)926(filterded)zoekvragenから30にショー21" を期待する
使用するライブラリ(ブートストラップ-4):
<script src="/webjars/jquery/3.2.1/jquery.min.js"></script>
<script src="/webjars/jquery-ui/1.12.1/jquery-ui.min.js"></script>
<script src="/webjars/popper.js/1.12.5/dist/umd/popper.min.js"></script>
<script src="/webjars/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
<script type="text/javascript" charset="utf-8" src="/webjars/datatables/1.10.15/media/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" charset="utf-8" src="/webjars/yadcf/0.9.1/jquery.dataTables.yadcf.js"></script>
<link rel="stylesheet" type="text/css" href="/webjars/jquery-ui/1.12.1/jquery-ui.min.css" />
<link rel="stylesheet" href="/webjars/bootstrap/4.0.0-beta/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="/webjars/datatables/1.10.15/media/css/jquery.dataTables.min.css" />
<link rel="stylesheet" type="text/css" href="/webjars/yadcf/0.9.1/jquery.dataTables.yadcf.css" />