This is very simple pager generator plugin that you can use for paginating preloaded content or using Ajax, for example. The plugin itself does not do nothing fancy - it just generate bootstrap styled pager widget and emit events everytime the page is changes so you can bind your custom logic.
The bare minimum for using jQuery Pager on a web page is linking to the library along with one of the styles and calling pager:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="../dist/pager.js"></script>$(document).ready(function() {
$('#container-element').pager({itemsNumber: 200});
});| Option | Description | Type | Default |
|---|---|---|---|
itemsNumber |
Total number of items to paginate | number |
1 |
currentPage |
Currently selected page - it is marked as active on the pagiination widget and it is always positioned on the center. | number |
1 |
farOffset |
Offset from the last page number displayed. For example, if the standard pager renders links for page 1-2-3-4-5 and we have farOffset set to 2, the widget will append also links to page 10 and 20, because 5 + 2 = 7 which is rounded up to 10 | number |
2 |
range |
How much links to sequential pages to be displayed | number |
6 |
range |
How much links to sequential pages to be displayed | number |
6 |
farRange |
How much links to non-sequential pages to be displayed | number |
2 |
containerClass |
CSS class to be used for container ul | string |
pagination |
onClick |
Callback function called every time page is clicked. It receives only one argument - the page number clickec | function |
null |