jquery datatable: page length select list not shown
18,217
Solution 1
Use the below dom value,
dom: 'Blfrtip',
Solution 2
You might be using Bfrtip
as dom value. Try using Blfrtip
. It will show Export buttons as well length menu.
Solution 3
Thanks to report, You can try the following way to solve it. Key point is to use 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,
..
Solution 4
You need to specify where in the dom the datatable widget will show the page size.
There is the dom option, something like this:
$('.table').dataTable({
'lengthMenu': [ [10, 25, 50, -1], [10, 25, 50, 'All'] ],
'aoColumns': [null, null, null, { 'bSortable': false }, { 'bSortable': false }]
dom:'<"yourcssstyle"l>'
});
Related videos on Youtube
Comments
-
BAE almost 2 years
I am using JQuery Datatable: 1.10.7 and https://datatables.net/reference/option/lengthMenu
JS code:
$('.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:
<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; }
-
Gone Coding about 8 yearsWhat version of dataTables are you using as they changed the parameter name a few times in the past.
-
BAE about 8 years"datatables": "git://github.com/DataTables/DataTables.git#1.10.7",
-
Gone Coding about 8 yearsIt looks that that parameter is now just
lengthChange
(nob
) -
Antony about 8 years"lengthMenu": [ 10, 25, 50, 75, 100 ]
-
BAE about 8 years@Antony Still missing "page length select list" datatables.net/reference/option/lengthMenu
-
Shady Alset about 8 years@BAE please show us the
"dom" :
options you are using, i think your problem with it. -
BAE about 8 years@ShadyAlset Thanks. I already updated my post. I am not sure whether it is what you are looking for. I did not use ""dom": 'lrtip'" in my js codes. I just used default for almost everything
-
Shady Alset about 8 years@BAE sorry but I meant the
dom:
option of datatables such aslengthMenu:
oraoColumns:
and so on, have you used it in your table ? -
BAE about 8 years@ShadyAlset already in my js codes. Thanks
-
Shady Alset about 8 years@BAE oh the length changing input control is included in dom options, i thought it missed, Thanks.
-
BAE about 8 yearsPlease see my update. Thanks
-
Shady Alset about 8 yearsPlease create a live example to work on it if you can, live.datatables.net
-
Kirill A over 6 yearsYou can find more info here: stackoverflow.com/questions/10630853/…
-