A jQuery plugin to provide simple yet fully customisable pagination
npm install paginationjs> A jQuery plugin to provide simple yet fully customisable pagination.
[![NPM version][npm-image]][npm-url]
[![Bower version][bower-image]][bower-url]

[npm-url]: https://npmjs.org/package/paginationjs
[npm-image]: http://img.shields.io/npm/v/paginationjs.svg
[bower-url]:http://badge.fury.io/bo/paginationjs
[bower-image]: https://badge.fury.io/bo/paginationjs.svg

See demos and full documentation at official site: http://pagination.js.org
npm install paginationjs or bower install paginationjs or just download pagination.js from the git repo.
``html`
`js`
$('#pagination-container').pagination({
dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 195],
callback: function(data, pagination) {
// template method of yourself
var html = template(data);
$('#data-container').html(html);
}
})
Below is a minimal rendering method:
`js`
function simpleTemplating(data) {
var html = '';
';
$.each(data, function(index, item){
html += '
});
html += '
return html;
}
Call:
`js`
$('#pagination-container').pagination({
dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 195],
callback: function(data, pagination) {
var html = simpleTemplating(data);
$('#data-container').html(html);
}
})
To make it easier to maintain, you'd better to use specialized templating engine to do that. Such as Handlebars and Undercore.template.
`html`
`js`
$('#pagination-container').pagination({
dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 195],
callback: function(data, pagination) {
var html = Handlebars.compile($('#template-demo').html(), {
data: data
});
$('#data-container').html(html);
}
})
`html`
`js``
$('#pagination-container').pagination({
dataSource: [1, 2, 3, 4, 5, 6, 7, ... , 195],
callback: function(data, pagination) {
var html = _.template($('#template-demo').html(), {
data: data
});
$('#data-container').html(html);
}
})
Or any other templating engine you prefer.
Released under the MIT license.
MIT: http://rem.mit-license.org, See LICENSE