TableSort (revisited) Pagination Demo

Pagination Demo

Give the table a class of the type paginate-N where "N" is an integer value representing the number of table rows to show for each page. Additionally, the class max-pages-N will tell the script to create a maximum of N numbered pagination links.

The following 102 line table has the following className:

class="sortable-onload-3r no-arrow colstyle-alt rowstyle-alt paginate-10 max-pages-7 paginationcallback-callbackTest-calculateTotalRating sortcompletecallback-callbackTest-calculateTotalRating"

Note: Hold down the shift key to select multiple columns to sort

The “Average (Fake) Rating” is calculated by using the callback function callbackTest.calculateTotalRating(). View the page source to see the actual callback function code.

The following “Simulate Table Filter” button simulates a filter being ran on the table data i.e. it removes table rows and then calls the tablePaginater.init method. The “Reset Table” button just resets the table to it’s initial value.

The following ten line table has no sort routine initiated and no max-pages-N defined within the className. As there are only two pages to create, the Next & Previous buttons will not be shown.

class="rowstyle-alt paginate-5"

View the related post or download the tablesort JavaScript source or the pagination JavaScript source.

Table styles courtesy of the wonderful Veerle.