Pagination will render pagination with bootstrap classes. The el must be a ul.
Example Usage
<ul class="pagination-test"></ul>
// Pull in the library
const UI = require('jibe-juice');
// Instantiate a component, pass the selector of the container to insert component into and the opts
const pagination = new UI.Pagination('.pagination-test', {
cssStyle: 'pagination',
edges: 0,
hrefTextPrefix: '#?page=',
itemsOnPage: 10,
nextText: '<span class="icon icon-arrow_forward icon-arrow"></span>',
onPageClick(pageNumber, event) {
alert('Page number: ' + pageNumber);
},
prevText: '<span class="icon icon-arrow_back icon-arrow"></span>'
});
// Render the DOM for the Pagination component
pagination.render();
params
Name
Type
Default
Description
el
string
undefined
A string of the selector for the element to put the component in
opts
object
{}
A catch all for various options. See the opts table below for options specific to this component.
opts
Name
Type
Default
Description
currentPage
number
1
The page we are currently on
edges
number
0
How many page numbers are visible at the beginning and ending of pagination