senzill-pagination
v2.1.0
Published
Senzill-Pagination is an easy to integrate jQuery pagination plugin.
Downloads
8
Maintainers
yak0d3Readme
Senzill-Pagination
An easy to integrate jQuery paginator.
Installation
You can install senzill-pagination using one of the following methods:
- Download: Download/Clone the senzill-pagination source code and add
senzill-pagination.jsto your<head/>tag
<head>
<link rel="stylesheet" type="text/css" href="bootstrap4.css">
<script src="jquery.js"></script>
<script src="senzill-pagination.js"></script>
</head>- NPM:
npm install --save senzill-pagination- jsDelivr CDN:
<head>
<link rel="stylesheet" type="text/css" href="bootstrap4.css">
<script src="jquery.js"></script>
<script src="https://cdn.jsdelivr.net/gh/yak0d3/[email protected]/senzill-pagination.js"></script>
</head>Usage
To start using senzill-pagination you have to follow simple steps to get your frontend pagination ready.
Add the panel's
<div/>on top of your content's wrapper<div id="sen-panel"></div>Add the navigation-bar's
</div>under your content's wrapper<div id="sen-nav"></div>Start the pagination with jQuery:
$(function(){ $('#wrapper_id').senzill({ nav: '#sen-nav', //The navbar id panel: '#sen-panel', //The panel id }); });
Parameters
The table displayed below explains all of the available parameters.
| Parameter | Required | Default | Description |
| ------------- | -------- | ------------------- | ------------------------------------------------------------ |
| elPerPage | No | 4 | [Integer] The number of elements to display per page. |
| nav | Yes | null | [String] The navigation bar id.Note: You have to create a div for the navbar and pass it as the nav parameter. |
| panel | No | null | [String] The panel id.Note: You have to create a div for the panel and pass it as the panel parameter. |
| nums | No | true | [Boolean] Specifies whether to show a numbered navigation or not. |
| showOptions | No | [5, 10, 15, 20, 30] | [Array] The options to display inside the panel's <select/> Note: If the elPerPage value is not in this array, it will be added automatically. |
Methods
The following table describes the list of available methods.
| Method | Description |
| ----------------------- | ----------------------------------------------- |
| elemLimit(int number) | Sets the number of elements to display per page |
| destroy() | Destroys the senzill-pagination instance. |
| reload() | reloads the senzill-pagination instance. |
| setPage(int pageNumber) | Destroys the senzill-pagination instance. |
| getPage() | Returns the current page number |
License
The MIT License. Copyright (c) 2019 Raed Yak