https://github.com/wang2lang/pagination
Pagination implemented in pure JavaScript
https://github.com/wang2lang/pagination
javascript pager pagination
Last synced: about 1 year ago
JSON representation
Pagination implemented in pure JavaScript
- Host: GitHub
- URL: https://github.com/wang2lang/pagination
- Owner: wang2lang
- Created: 2017-03-02T11:21:14.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-03-03T04:32:20.000Z (over 9 years ago)
- Last Synced: 2025-04-22T23:49:43.202Z (about 1 year ago)
- Topics: javascript, pager, pagination
- Language: JavaScript
- Size: 9.77 KB
- Stars: 9
- Watchers: 0
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# js-pagination
pagination implemented in pure JavaScript
## Install & run example
```
// install
npm i -S 'js-pagination'
// run example
git clone https://github.com/rainjay/pagination.git
cd pagination
npm install
npm run dev
```
## Example demo
DEMO
## Usage
```
require('js-pagination/dist/styles.css')
var Pagination = require('js-pagination')
// config
Pagination.config({
ulClass: 'pagination',
activeClass: 'active',
...
})
// use
var myPager = new Pagination(100, 15, function(page) {}, '.field')
myPager.getCurrentPage()
myPager.goToPage(num)
// html
```
## API
### config attributes (optional)
| key | Type | Details |
| :----- | :----: | :-------: |
| ulClass | String | class name for page lists, default 'pagination' |
| activeClass | String | class name for active page item, default 'active'|
| disableClass | String | disable class name for disabled item, default 'disabled'|
| dots | String | default '...' |
| hideIfEmpty | Boolean | whether to hide paging if only have one page, default true|
|showPreNext| Bollean|whether show pre and next button, default true |
| scrollTop | Bollean | whether scroll to top after you select one page, default false |
| scrollContainer| String | which container to scroll |
| adjacent | Number|the page amount before and after the current page, default 2|
| lang | 'cn' or 'en' | default 'cn' |
### var pager = new Pagination(total, size, callback, fieldSelector)
| key | Type | Details |
| :----- | :----: | :-------: |
| total | Number | the total size of what you are displaying |
| size | Number | size of each page, default 1 |
| size | Number | size of each page, default 1 |
|callback| Function | call back for page select operation |
|fieldSelector| String | the field u want to mount, exp: '.field' |
### pager.goToPage(num)
| key | Type | Details |
| :----- | :----: | :-------: |
| num | Number | the page num will go to |
### pager.getCurrentPage()