分页（分页）
用$.fn.pagination.defaults重写defaults
这个分页控件允许用户通过页码的方式导航数据，它支持可配置的选项页面导航和页面长度，使用者可以在右侧添加自定义按钮来增加其功能。
依赖项（Dependencies）
linkbutton
使用示例（Usage Example）
通过标记的方式创建分页
通过javascript的方式创建分页
$('#pp').pagination({
total:2000,
pageSize:10
},2);
通过panel和pagination插件创建ajax分页。当用户选择一个新的页面，面板将会正确的显示指定的页面。
面板默认情况下是显示第一页的内容，单用户选择浏览某个页面，‘onSelectPage’事件将被触发。‘refresh’方法将在面板上通过新的url参数加载新的页面。
属性（Properties）
|
Name
|
Type
|
Description
|
Default
|
|
total
|
number
|
所有的记录数，当分页控件被创建的时候就应该被设置。
|
1
|
|
pageSize
|
number
|
页数
|
10
|
|
pageNumber
|
number
|
当分页控件被创建的时候显示页码
|
1
|
|
pageList
|
array
|
用户可以改变每页显示的数据条数，pagelist属性可以定义显示哪些条数，代码示例：
$('#pp').pagination({
pageList: [10,20,50,100]
},2);
|
[10,20,30,50]
|
|
loading
|
boolean
|
定义加载数据
|
false
|
|
buttons
|
array,selector
|
定义自定义按钮，可能的值
1、一个数组，每个按钮包含2个属性：iconCls：能显示背景图片的类名。Handler：当按钮被点击时候的处理的程序
2、一个表面按钮的选择器
按钮可以通过标记的方式定义
按钮也可以通过javascript创建
$('#pp').pagination({
total: 114,
buttons: [{
iconCls:'icon-add',
handler:function(){alert('add')}
},'-',{
iconCls:'icon-save',
handler:function(){alert('save')}
}]
},2);
|
null
|
|
layout
|
array
|
分页控件的布局设置，此属性从1.3.5开始的
布局选项包括1个或多个以下的值：
List：每页显示条数列表
Sep：页数按钮的分隔符
First：第一个按钮
Prev：前一页按钮
Next：下一页按钮
Last：最后一页按钮
Refresh：刷新按钮
Manual：
Links：
$('#pp').pagination({
layout:['first','links','last']
},2);
|
|
|
links
|
number
|
链接数量，只有当‘layout’包含‘links’的时候才可用，这时1.3.5新增的属性
|
10
|
|
showPageList
|
boolean
|
是否显示每页显示条数下拉框
|
true
|
|
showRefresh
|
boolean
|
是否显示刷洗按钮
|
true
|
|
beforePageText
|
string
|
在输入组件钱显示文本
|
Page
|
|
afterPageText
|
string
|
在输入组建后显示文本
|
of {pages}
|
|
displayMsg
|
string
|
显示分页信息
|
Displaying {from} to {to} of {total} items
|
事件（Events）
|
Name
|
Parameters
|
Description
|
|
onSelectPage
|
pageNumber, pageSize
|
单用户选择一个新页数的时候触发，回调函数包括2个参数
Pagenumber：新的条数数量
Pagesize：新的页码
代码示例：
$('#pp').pagination({
onSelectPage:function(pageNumber, pageSize){
$(this).pagination('loading',2);
alert('pageNumber:'+pageNumber+',pageSize:'+pageSize,2);
$(this).pagination('loaded',2);
}
},2);
|
|
onBeforeRefresh
|
pageNumber, pageSize
|
在刷新按钮被点击前触发，返回false取消刷新时间
|
|
onRefresh
|
pageNumber, pageSize
|
在刷新之后被触发
|
|
onChangePageSize
|
pageSize
|
当用户改变每页显示条数的时候被触发。
|
方法（Methods）
|
Name
|
Parameter
|
Description
|
|
options
|
none
|
Return the options object.
返回options对象
|
|
loading
|
none
|
Make the pagination to become loading status.
标记分页控件为loading状态
|
|
loaded
|
none
|
Make the pagination to become loaded status.
表姐分页控件为loaded状态
|
|
refresh
|
options
|
Refresh and display pager information. This method is available since version 1.3.
Code example:
刷新显示分页信息，是1.3以后新增的方法
代码示例：
$('#pp').pagination('refresh',2);?????????????? // refresh the pager bar information
$('#pp').pagination('refresh',{????????????? // change options and refresh pager bar information
?????????????? total: 114,
?????????????? pageNumber: 6
},2);
|
|
select
|
page
|
Select a new page. The page index start with 1. This method is available since version 1.3.
Code example:
选择一个新的页码，页数是从1开始的，此方法是1.3新增的
代码示例：
$('#pp').pagination('select',2); // refresh the current page
$('#pp').pagination('select', 2,2);???????????? // select the second page
|
编程那点事
