EasyUI datagrid 分页的实现 .

在使用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和页码。相信后面的分页实现对大大家也不会又太大的问题。