Introducing Scroller - Virtual Scrolling for DataTables
Introducing Scroller - Virtual Scrolling for DataTables
allan
Posts: 61,972Questions: 1Answers: 10,160 Site admin
Hello all,
As part of the DataTables 1.8 package I introduced a new "extra" called Scroller. This plug-in gives DataTables virtual scrolling capabilities, which basically means a scrolling table can be used to show very large datasets with great performance.
There is a blog post discussing Scrolling and how it works here:
http://datatables.net/blog/Introducing_Scroller_-_Virtual_Scrolling_for_DataTables
Documentation for Scroller is available here:
http://datatables.net/docs/Scroller/
And examples here:
http://datatables.net/extras/scroller/examples
Scroller was made possible thanks to the support from John Wiley & Sons, Inc. ( http://wiley.com/ ) and I'd like to take this opportunity to thank them for supporting the DataTables project!
Enjoy!
Allan
As part of the DataTables 1.8 package I introduced a new "extra" called Scroller. This plug-in gives DataTables virtual scrolling capabilities, which basically means a scrolling table can be used to show very large datasets with great performance.
There is a blog post discussing Scrolling and how it works here:
http://datatables.net/blog/Introducing_Scroller_-_Virtual_Scrolling_for_DataTables
Documentation for Scroller is available here:
http://datatables.net/docs/Scroller/
And examples here:
http://datatables.net/extras/scroller/examples
Scroller was made possible thanks to the support from John Wiley & Sons, Inc. ( http://wiley.com/ ) and I'd like to take this opportunity to thank them for supporting the DataTables project!
Enjoy!
Allan
This discussion has been closed.
Replies
Thats a really nice plug-in.
Ive tried it with Ignited Datatables (wrapper library for codeigniter) and it's working great.
http://imbx.us/Rh7.jpg (i dunno why search bar hides there ^^)
It works great with 1000 rows as it seems in the pic.
but ive got some troubles with 13 rows. It is sending "iDisplayStart -5" when i scroll down.
Thanks,
Yusuf
Great to hear it works well with Ignited Datatables :-). I've just added a small fix for the iDisplayStart issue you were seeing - you can get this from the downloads page ( http://datatables.net/download ) as the 'dev' version of Scroller. Basically the calculation that was being done could result in a negative number as you were seeing - I've added a check and correction for this now.
Regards,
Allan
Allan
Great stuff as usual :)
I saw in the Scroller documentation that the row height calculation is slightly off if it isn't the same for all rows. This is exactly what happened in my case and it's not a possibility for me to add the suggested css [code]th, td { white-space: nowrap; }[/code]. Do you plan to fix it in further release?
And by the way I think there's some words missing in your blog post about the Virtual Scroller right after: "to your CSS, or wrapping the content of the cells in a"
I'm afraid not - no. The fact that all rows must be the same height is engrained deeply into Scroller. For example, if you have 2 million rows, and want to jump to row 1.5 million - you'd need to know the height of 1.5 million rows, which would kill any CPU! This is why Scroller has to make this assumption.
DataTables can do what you want - just disabled Scroller, keep y-scrolling enabled and disable pagination - however, it means you can't take advantage of the speed optimisations of Scroller.
Thanks for the heads up about the blog post formatting!
Allan