1.0.1 • Published 5 years ago

just-my-pagination v1.0.1

Weekly downloads
1
License
ISC
Repository
github
Last release
5 years ago

Just My Pagination

A simple pagination module that returns HTML pagination links for your front-end projects.
Pagination links are returned as /pageUri/pageNumber/.
By default Just My Paginatuon supports Google Material Icons for navigation arrows. If you want to use them don't forget to include in your pages the relative icon font and CSS.

Installation

$ npm install just-my-pagination

Example

This server side code:

var options = {
   pName: 'example', /*Page path*/
   total: 500, /*Total number of results*/
   page: 1, /*Actual page number*/
   query: req.query, /* Query String*/
   limit: 20, /* Results per page*/
}

pagination = require('just-my-pagination').getPagination(options);

Returns client side:

<div id="pagination">
   <span>
      <a href="/example/1/?order=date&sort=desc"><i class="material-icons">first_page</i></a>
   </span>
   <span>
      <a href="/example/3/?order=date&sort=desc"><i class="material-icons">chevron_left</i></a>
   </span>
   <a href="/example/1/?order=date&sort=desc">1</a>
   <a href="/example/2/?order=date&sort=desc">2</a>
   <a href="/example/3/?order=date&sort=desc">3</a>
   <strong>4</strong>
   <a href="/example/5/?order=date&sort=desc">5</a>
   <a href="/example/6/?order=date&sort=desc">6</a>
   <a href="/example/7/?order=date&sort=desc">7</a>
   <span>
      <a href="/example/5/?order=date&sort=desc"><i class="material-icons">chevron_right</i></a>
   </span>
   <span>
      <a href="/example/25/?order=date&sort=desc"><i class="material-icons">last_page</i></a>
   </span>
</div>

Options

PropDescriptionDefault
pNameAbsolute path of the page where you want to use JMP.None
totalTotal number of results showed per page (required to calculate how many page there is).None
limitHow many results you show per page (required to calculate how many page there is).None
pageActual page number. As you can see in above example it's wrapped in a strong tag.None
queryURL query string to pass throug pages.None
pagID(Optional) HTML ID property name of pagination block.pagination
firstPage(Optional) HTML of first page link.<i class="material-icons">first_page</i>
prevPage(Optional) HTML of previous page link.<i class="material-icons">chevron_left</i>
nextPage(Optional) HTML of next page link.<i class="material-icons">chevron_left</i>
lastPage(Optional) HTML of last page link.<i class="material-icons">last_page</i>
range(Optional) Number of links before and after actual page number.3