在使用easyUI datagrid时候，很常见的是分页的使用。但是刚开始使用中，并没有发现demo中有对分页使用比较详细的介绍。这时如何实现分页功能？
下面我来具体介绍一下，下面的绑定数据的代码相信大家都很熟悉了。
$('#GetProductTable').datagrid({
url: 'ProductHandler.ashx?act=productlist&querystring=' + queryCondition,
title: '产品数据',
'100%',
height: 'auto',
fitColumns: true,
striped: true,
singleSelect: true,
columns: [[
{ field: 'ProductID', title: '产品编号', $(this).width() * 0.03, align: 'center' },
{ field: 'ProductName', title: '产品名称', $(this).width() * 0.08, align: 'center' },
{ field: 'ProductType', title: '产品类别', $(this).width() * 0.08, align: 'center' },
{ field: 'ProductOriginalPrice', title: '产品原价', $(this).width() * 0.08, align: 'center' },
{ field: 'ProductSalePrice', title: '产品销售价', $(this).width() * 0.08, align: 'center' },
{ field: 'ProductDesc', title: '描述', $(this).width() * 0.1, align: 'center' }
]],
pagination: true,
pageSize: 10,
pageList: [10, 20, 30, 50],
rownumbers: true,
onDblClickRow: function () {
var selected = $('#GetProductTable').datagrid('getSelected');
if (selected) {
$('#detailwindow').window({
title: '产品信息',
900,
modal: false,
shadow: false,
closed: false,
height: 600,
content: '<iframe scrolling="yes" frameborder="0" src="ProductDetail.aspx?ID=' + selected.ProductID + '&mode=Browse" style="100%;height:100%;"></iframe>'
//href:"ProductDetail.aspx?ID=" + selected.ProductID + "&mode=Browse"
});
}
}
});
var p = $('#GetProductTable').datagrid('getPager');
$(p).pagination({
onBeforeRefresh: function () {
alert('before refresh');
}
});
但是要实现分页，需要哪些注意对方呢? 属性pagination需要设置为： true。然后怎么获取每页的pagesize和需要显示数据的页码，其实这些值datagrid已经在请求数据的URL的post信息中加上了这些参数，如下图：
这时，只要我们在代码中直接通过这两个参数就能获取我们需要的pagesize和页码。相信后面的分页实现对大大家也不会又太大的问题。