easyUI 实现分页功能

需要注意的就是:存 放每页的记录数rows,与  存放总记录数total 
$(function() {
    userDataGrid = $('#userDataGrid').datagrid({
        url : '${path }/accound/showAccoundList',
        fit : true,
        striped : true,
        rownumbers : true,
        pagination : true,
        singleSelect : true,
        idField : 'id',
        sortName : 'addDate',
        sortOrder : 'desc',
        pageSize: 20,
        columns : [ [ {
            width : '130',
            title : 'id',
            field : 'id',
            sortable : true
        }, {
            width : '130',
            title : '用户名',
            field : 'userId',
            sortable : true
        },{
            width : '130',
            title : '会员姓名',
            field : 'nickname',
            formatter: function(value,row,index){
                var roles = '';
                for(var i=0;i<row.userMsgList.length;i++){
                    roles += row.userMsgList[i].nickname ;
                }
                return roles;
            }
        },
      
        ] ],      
        toolbar : '#userToolbar'
    });
});


//设置分页控件
var p = $('#userDataGrid').datagrid('getPager');
$(p).pagination({
  //  pageSize: 20,//每页显示的记录条数,默认为10
    pageList: [20,40,60],//可以设置每页记录条数的列表
    beforePageText: '第',//页数文本框前显示的汉字
    afterPageText: '页    共 {pages} 页',
    displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录',
    /*onBeforeRefresh:function(){
        $(this).pagination('loading');
        alert('before refresh');
        $(this).pagination('loaded');
    }*/
});

猜你喜欢

转载自blog.csdn.net/cmj962464/article/details/82183948