- Notifications
You must be signed in to change notification settings - Fork67
Pagination for javascript and nodejs
License
vanng822/pagination
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Pagination for javascript/nodejs
varpagination=require('pagination');varpaginator=pagination.create('search',{prelink:'/',current:1,rowsPerPage:200,totalResult:10020});console.log(paginator.render());
This example show how to generate markup for twitter boostrap, see example/twitter.html for template rendering
varpagination=require('pagination')varboostrapPaginator=newpagination.TemplatePaginator({prelink:'/',current:3,rowsPerPage:200,totalResult:10020,slashSeparator:true,template:function(result){vari,len,prelink;varhtml='<div><ul>';if(result.pageCount<2){html+='</ul></div>';returnhtml;}prelink=this.preparePreLink(result.prelink);if(result.previous){html+='<li><a href="'+prelink+result.previous+'">'+this.options.translator('PREVIOUS')+'</a></li>';}if(result.range.length){for(i=0,len=result.range.length;i<len;i++){if(result.range[i]===result.current){html+='<li><a href="'+prelink+result.range[i]+'">'+result.range[i]+'</a></li>';}else{html+='<li><a href="'+prelink+result.range[i]+'">'+result.range[i]+'</a></li>';}}}if(result.next){html+='<li><a href="'+prelink+result.next+'">'+this.options.translator('NEXT')+'</a></li>';}html+='</ul></div>';returnhtml;}});console.log(boostrapPaginator.render());
varpagination=require('pagination');varpaginator=newpagination.SearchPaginator({prelink:'/',current:10,rowsPerPage:200,totalResult:10020});console.log(paginator.render());// output (without newlines)
<divclass="paginator"><ahref="/?page=9"class="paginator-previous">Previous</a><ahref="/?page=8"class="paginator-page paginator-page-first">8</a><ahref="/?page=9"class="paginator-page">9</a><ahref="/?page=10"class="paginator-current">10</a><ahref="/?page=11"class="paginator-page">11</a><ahref="/?page=12"class="paginator-page paginator-page-last">12</a><ahref="/?page=11"class="paginator-next">Next</a></div>
varpagination=require('pagination');varpaginator=newpagination.SearchPaginator({prelink:'/',current:3,rowsPerPage:200,totalResult:10020});console.log(paginator.getPaginationData());// output{prelink:'/',current:3,previous:2,next:4,first:1,last:51,range:[1,2,3,4,5],fromResult:401,toResult:600,totalResult:10020,pageCount:51}
<html><head><scriptsrc="../release/pagination.full.min.js"></script></head><body><divid="paging"></div><scripttype="text/javascript">(function(){varpaginator=newpagination.ItemPaginator({prelink:'/',current:3,rowsPerPage:200,totalResult:10020});varhtml=paginator.render();varpaginator=pagination.create('search',{prelink:'/',current:1,rowsPerPage:200,totalResult:10020});html+=paginator.render();document.getElementById("paging").innerHTML=html;})();</script></body></html>
You can browse example folder for more. Release folder contains all mimified versions for browser. To customize your need you can use ./bin/build.js -hhtml += paginator.render();
optionsSee Options bellow
See alsohttp://developer.yahoo.com/ypatterns/navigation/pagination/search.html
optionsSee Options bellow
See alsohttp://developer.yahoo.com/ypatterns/navigation/pagination/item.html
optionsSee Options bellow
This class will render the markup as desired. The options must contains property "template"It can be either a template string or a compiled template. The local variables available in the template are
prelinkStringpreparedPreLinkStringcurrentIntegerpreviousIntegernextIntegerfirstIntegerlastIntegerrangeArrayfromResultIntegertoResultIntegertotalResultIntegerpageCountIntegertranslationsObject with properties NEXT, PREVIOUS, FIRST, LAST, CURRENT_PAGE_REPORT
Return an object contains data for rendering markup. See example above.
Set value to a single for option. See options section bellow
prelinkString
Append page param to the link
Return the rendered markup
typeStringoptionsObject see Options section bellow
Wrapper for create instance of classes above
See pagination.TemplateEngine.compile bellow
strTemplate stringoptionsobject which can contains .open .close .cache and .id
Object to pass to paginator classes (second argument when using create function)
Number of total items in result set
Link to append the page-param
Number of items per page, default to 10
Number of links to create in page range, default to 5. This value will be ignored when using item pagination.
Indicate which page is the current one. Page always starts with 1.
To indicate if the result from CURRENT_PAGE_REPORT translation can be cached or not. Default is false.The cache is global and will be the same for all instances which have specified translationCacheKey as bellow.
For supporting multiple versions of translation of CURRENT_PAGE_REPORT. It can use for multilanguages or different formats. Default is "en"
For translations of FIRST, NEXT, ... Simple example
vartranslations={'PREVIOUS' :'Voorgaand','NEXT' :'Volgende','FIRST' :'Eerst','LAST' :'Laatste','CURRENT_PAGE_REPORT' :'Resulten {FromResult} - {ToResult} van {TotalResult}'};varitem=newItemPaginator({prelink :'/',pageLinks :5,current :5,totalResult :100,translator :function(str){returntranslations[str];}});
The name of the page parameter. Default is "page"
Indicate if using slash instead of equal sign, ie /page/2 instead of /?page=2, default is false.
This can be a template string or a compiled template (function).The compiled function will be called with an object as argument.
Template engine is taking mostly fromhttps://github.com/vanng822/ejs which is a fork ofhttps://github.com/visionmedia/ejs
About
Pagination for javascript and nodejs