My datatable looks like this:
Here it is showing default 10 datas in a single page.I need to show 1 to 5 of 58 entries so i tried to put max:5 but it is not working.I need to show only 5 data and the user may use pagination for other data access.
My code for datatable is:
var table = $('#firstTable').DataTable({
"processing" : true,
"scrollY": 410,
"scrollX": true,
order: [ 0, 'asc' ],
max :5,
"ajax" : {
"url" : A_PAGE_CONTEXT_PATH + "/form/api/getAllSelection/all",
dataSrc : ''
},
"columns" : [ {
"data" : "selectionId"
}, {
"data" : "selectionDate"
}, {
"data" : "selectedBy"
}, {
"data" : "eximPanNo"
}, {
"data" : "eximPanName"
}, {
"data" : "eximPanAddr"
}, {
"data" : "eximPanPhone"
}, {
"data" : "selectionType"
} ]
});
My datatable looks like this:
Here it is showing default 10 datas in a single page.I need to show 1 to 5 of 58 entries so i tried to put max:5 but it is not working.I need to show only 5 data and the user may use pagination for other data access.
My code for datatable is:
var table = $('#firstTable').DataTable({
"processing" : true,
"scrollY": 410,
"scrollX": true,
order: [ 0, 'asc' ],
max :5,
"ajax" : {
"url" : A_PAGE_CONTEXT_PATH + "/form/api/getAllSelection/all",
dataSrc : ''
},
"columns" : [ {
"data" : "selectionId"
}, {
"data" : "selectionDate"
}, {
"data" : "selectedBy"
}, {
"data" : "eximPanNo"
}, {
"data" : "eximPanName"
}, {
"data" : "eximPanAddr"
}, {
"data" : "eximPanPhone"
}, {
"data" : "selectionType"
} ]
});
Share
Improve this question
edited Jan 24, 2019 at 4:41
ashwin karki
asked Jan 24, 2019 at 4:33
ashwin karkiashwin karki
6735 gold badges21 silver badges37 bronze badges
2 Answers
Reset to default 14There is a option called pageLength
. You can set this for show only 5 entries.
var table = $('#firstTable').DataTable({
pageLength : 5,
lengthMenu: [[5, 10, 20, -1], [5, 10, 20, 'Todos']]
})
For details see : https://datatables.net/forums/discussion/46346/how-to-show-less-than-10-rows
You need to use option pageLength, like this:
var table = $('#firstTable').DataTable(
{
"processing": true,
"scrollY": 410,
"scrollX": true,
order: [ 0, 'asc' ],
//max :5, WRONG OPTION!
"pageLength": 5,
"ajax" : {
"url" : A_PAGE_CONTEXT_PATH + "/form/api/getAllSelection/all",
dataSrc : ''
},
"columns" : [ {
"data" : "selectionId"
}, {
"data" : "selectionDate"
}, {
"data" : "selectedBy"
}, {
"data" : "eximPanNo"
}, {
"data" : "eximPanName"
}, {
"data" : "eximPanAddr"
}, {
"data" : "eximPanPhone"
}, {
"data" : "selectionType"
} ]
});