分页的步骤:
1.首先根据前台页面传来的分页参数,从数据库查询所得的数据。
2.数据包含查处可以分出多少页,每一页显示的数据。
3.返回给分页插件,数据交给到前端页面显示。
//查询参数
//getFormData获得前台数据
var requestParam = jQuery.extend(this.getFormData(this.options.queryForm) ,
//pageParam 分页请求参数,如果为空默认请求第一页数据
pageParam ? pageParam : {
pagenum : 0
}) ;
//pageobj中包含三个key的数据分别为pagenum(当前页号)、pagesize(当前页大小)、 totalelements(所有记录)、pageNumClickFn//分页点击的处理函数
initPaginationByObject : function(pageobj , initPageNumClickFn){
//分页初始化对象不为空,且需要的分页参数都为数字,则进行分页插件初始化
if(pageobj && !isNaN(pageobj.pagenum) &&
!isNaN(pageobj.pagesize) && !isNaN(pageobj.totalelements)){
this.initPagination(pageobj.pagenum, pageobj.pagesize,
pageobj.totalelements, initPageNumClickFn) ;
}
//每次点击对调函数
var callbackFn = function(clickedPageNum , pageContainer){
//对请求的同一页,不重复发送请求
if(Number(this.pageNum)==Number(clickedPageNum)){
return ;
}
this.pageNum = clickedPageNum ;
//如果设置了回调函数,则执行,第一个参数默认为分页参数
if(this.pageNumClickFn){
//获取分页请求参数,包括分页号, 默认不包含每页大小和所有记录数。
this.pageNumClickFn.call(null , this.getPageParam(true)) ;
}
}.bind(this) ;
//分页插件属性配置
var optInit = {
current_page : this.pageNum ,
items_per_page : this.pageSize ,
num_display_entries : 5 ,
num_edge_entries : 2 ,
prev_text : "上一页" ,
next_text : "下一页" ,
callback : callbackFn ,
prev_show_always : false ,
next_show_always : false
};
//只覆盖分页插件中自定义的属性
for ( var optKey in optInit) {
if(this.options[optKey]){
optInit[optKey] = this.options[optKey] ;
}
}
//初始化分页
$(paginationId).pagination(this.totalelements , optInit); //真正执行分页
参数名 | 描述 | 参数值 |
maxentries | 总条目数 | 必选参数,整数 |
items_per_page | 每页显示的条目数 | 可选参数,默认是10 |
num_display_entries | 连续分页主体部分显示的分页条目数 | 可选参数,默认是10 |
current_page | 当前选中的页面 | 可选参数,默认是0,表示第1页 |
num_edge_entries | 两侧显示的首尾分页的条目数 | 可选参数,默认是0 |
link_to | 分页的链接 | 字符串,可选参数,默认是"#" |
prev_text | “前一页”分页按钮上显示的文字 | 字符串参数,可选,默认是"Prev" |
next_text | “下一页”分页按钮上显示的文字 | 字符串参数,可选,默认是"Next" |
ellipse_text | 省略的页数用什么文字表示 | 可选字符串参数,默认是"..." |
prev_show_always | 是否显示“前一页”分页按钮 | 布尔型,可选参数,默认为true,即显示“前一页”按钮 |
next_show_always | 是否显示“下一页”分页按钮 | 布尔型,可选参数,默认为true,即显示“下一页”按钮 |
callback | 回调函数 | 默认无执行效果 |