Easy Table & List Pagination Plugin With jQuery - Paginathing

Easy Table & List Pagination Plugin With jQuery - Paginathing
File Size: 8.96 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Paginathing is a simple yet fully configurable jQuery client-side pagination plugin which allows to paginate any DOM elements like large html tables and lists. Compatible with Twitter's Bootstrap framework.

How to use it:

1. Add jQuery library and the jQuery Paginathing plugin to the webpage.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="paginathing.js"></script>

2. Calling the function paginathing on the target selector and the plugin will take care of the rest.

// paginate an unordered list
$('ul').paginathing()

// paginate an html table
$('table tbody').paginathing();

3. Calling the function paginathing on the target selector and the plugin will take care of the rest.

// paginate an unordered list
$('ul').paginathing()

// paginate an html table
$('table tbody').paginathing();

4. Specify how many child elements to display per page.

$('.selector').paginathing({
  perPage: 5,
})

5. Config the pagination controls:

$('.selector').paginathing({

  // Limites your pagination number
  // false or number
  limitPagination: false,

  // Pagination controls
  prevNext: true,
  firstLast: true,
  prevText: '&laquo;',
  nextText: '&raquo;',
  firstText: 'First',
  lastText: 'Last',
  containerClass: 'pagination-container',
  ulClass: 'pagination',
  liClass: 'page',
  activeClass: 'active',
  disabledClass: 'disabled',
  
})

6. Append the pagination controls after a certain element.

$('.selector').paginathing({

  insertAfter: null
  
})

7. Decide whether to show the current page number of total pages number.

$('.selector').paginathing({

  pageNumbers: false
  
})

Change log:

2018-02-01

  • Code formatting, add build command

This awesome jQuery plugin is developed by alfrcr. For more Advanced Usages, please check the demo page or visit the official website.