[英]jquery datatable: page length select list not shown
I am using JQuery Datatable: 1.10.7 and https://datatables.net/reference/option/lengthMenu我正在使用 JQuery 数据表:1.10.7 和https://datatables.net/reference/option/lengthMenu
JS code: JS代码:
$('.table').dataTable({
'lengthMenu': [ [10, 25, 50, -1], [10, 25, 50, 'All'] ],
'aoColumns': [null, null, null, { 'bSortable': false }, { 'bSortable': false }] }); // eslint-disable-line new-cap
But I need the following list to set page length:但我需要以下列表来设置页面长度:
How to do?怎么办? Anything missing?
缺什么吗?
UPDATE更新
Output html:输出html:
<div id="DataTables_Table_0_length" class="dataTables_length">
<label>
Show
<select class="" aria-controls="DataTables_Table_0" name="DataTables_Table_0_length">
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="-1">All</option>
</select>
entries
</label>
</div>
But it is not shown at all.但它根本没有显示。
UPDATE更新
The reason is:原因是:
.dataTables_length {
display: none;
}
使用下面的dom值,
dom: 'Blfrtip',
You might be using Bfrtip
as dom value.您可能正在使用
Bfrtip
作为dom值。 Try using Blfrtip
.尝试使用
Blfrtip
。 It will show Export buttons as well length menu.它将显示导出按钮以及长度菜单。
You need to specify where in the dom the datatable widget will show the page size.您需要指定数据表小部件在 dom 中的哪个位置显示页面大小。
There is the dom option, something like this:有 dom 选项,如下所示:
$('.table').dataTable({
'lengthMenu': [ [10, 25, 50, -1], [10, 25, 50, 'All'] ],
'aoColumns': [null, null, null, { 'bSortable': false }, { 'bSortable': false }]
dom:'<"yourcssstyle"l>'
});
https://datatables.net/reference/option/dom https://datatables.net/reference/option/dom
Thanks to report, You can try the following way to solve it.感谢报告,您可以尝试以下方法解决。 Key point is to use dom:'Blfrtip'
关键是使用 dom:'Blfrtip'
$('#tblClient').DataTable({
dom: 'Blfrtip',
buttons: [
'colvis',
'excel', {
extend: 'pdfHtml5',
exportOptions: {
columns: ':visible'
},
text: 'Download Pdf',
title: 'HCA Registration for Worker Portal',
orientation: 'landscape',
customize: function (doc) {
// Splice the image in after the header, but before the table
doc.content.splice(1, 0, {
margin: [0, 0, 0, 12],
alignment: 'center',
image: 'data:image/png;base64,iVBORw0KGgoAA..'
});
}
}],
'ordering': true,
'searching': true,
'info': true,
"serverSide": false,
"lengthMenu": [[50, 100 - 1], [50, 100, "All"]],
"pageLength": 50,
..
在你的表标签中使用 id="datatable-keytable"
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.