JQuery easyui Datagrid 分页事件

easyui是jQuery中的一个轻量级UI插件，提供了一些诸如window、datagrid、button等控件。现在主要说说Datagrid中分页控件的使用。

 

easyui中可以单独添加分页pagination控件，也可以在datagrid中添加paginatio控件。

如在datagrid中添加分页控件：

[c-sharp] view
plain copy

$('#tt').datagrid({  

    title:'Load Data',  

    iconCls:'icon-save',  

    width:600,  

    height:250,  

    url:'/demo3/data/getItems',  

    columns:[[  

        {field:'itemid',title:'Item ID',width:80},  

        {field:'productid',title:'Product ID',width:80},  

        {field:'listprice',title:'List Price',width:80,align:'right'},  

        {field:'unitcost',title:'Unit Cost',width:80,align:'right'},  

        {field:'attr1',title:'Attribute',width:100},  

        {field:'status',title:'Status',width:60}  

    ]],  

    pagination:true //这里添加分页控件  

});  

 

可以扑捉分页的触发事件，方法如下：

[javascript] view
plain copy

var pg = $("#tt").datagrid("getPager");  

if(pg)  

{  

   $(pg).pagination({  

       onBeforeRefresh:function(){  

           alert('before refresh');  

    },  

       onRefresh:function(pageNumber,pageSize){  

           alert(pageNumber);  

           alert(pageSize);  

        },  

       onChangePageSize:function(){  

           alert('pagesize changed');  

        },  

       onSelectPage:function(pageNumber,pageSize){  

           alert(pageNumber);  

           alert(pageSize);  

        }  

   });  

}  

 

在触发onChangePageSize事件时，会同时触发onSelectPage事件。onSelectPage事件会传递2个参数pageNumber、pageSize.

pageSize是页大小，pageNumber为下一次显示的页号，默认从第一页开始。

上面的用法是1.4.*的用法。

今天用jquery1.6.4的时候，发现传递的参数已经变成page，rows.  page 默认为1 ，rows默认为10.

原文地址：http://blog.csdn.net/longlongmylove/article/details/5975995