Scroller Plugin is using pagination and displays the page number at bottom to navigate
Scroller Plugin is using pagination and displays the page number at bottom to navigate

We are using latest Scroller Plugin(v2.0.3) and DataTable(v1.10.22)
$('#portfolioTable').DataTable({
bDeferRender: true,
scrollY: true,
scrollCollapse: true,
stateSave: false,
info: false,
scroller: {
loadingIndicator: true,
displayBuffer: 10
},
data: myPortfolioList,
ordering:false,
searching:false,
columns[
render: function(data, type, full, meta){
return '<div>full.text<div>'
}
]
});
When use the above code scroller is using pagination and displaying the page numbers to navigate to next page.
But we want to have the complete data in single page without pagination.
Should load the data while scrolling
This question has an accepted answers - jump to answer
This discussion has been closed.
Answers
I'm not clear what the problem is, as it works fine here. We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin
@colin
Please check this sample code
https://jsfiddle.net/pe6rk92L/2/
We had 120 items in the JSON Array
But it is not displaying all items on scroll and we don't need pagination.
Thanks in Advance
You are missing the datatables and scroller CSS files so the table styling doesn't look right.
Set the height of for
scrollY
, like in this example, for scrolling to work. Here is the updated example:https://jsfiddle.net/qwsz0obh/
You might be able to get the same result without the need of the scroller extension. See this example:
https://jsfiddle.net/qwsz0obh/1/
Kevin