easyui datagrid+springmvc+json来进行分页处理

用springmvc+easyui做分页,分页这个问题困扰了我几天,所以现在我把代码给贴出来

  步骤:

   1.在页面添加easyui的插件(js)

   2.定义一个table,看把查询出来的数据放到那个里面

   3.定义一个js,来编写处理的js

     代码:

  jsp页面代码:

 
                


             
        
        

        
  
    


 PrepayRecord.js代码 主要代码

var basePath = '';
function init(comFlag,userType,serverPath) {
    basePath = serverPath;
    $("#tt").datagrid({
        url : null,
        singleSelect : true, /*是否选中一行*/
        width:'auto', 
        pagination : true,/*是否显示下面的分页菜单*/


        border:false,
        rownumbers:true,
        columns : [ [  {
            field : 'tradeSn', //这个对应的是实体类类里面属性
            title : 'id号',
            width : '160',
            align : 'center'
        }, {
            field : 'shortName',
            title : '商户名称',
            width : '50',
            align : 'center'
        }/*这里省略了其他的field*/
        ]]/*,
        loadMsg : '数据加载中,请稍候......'*/
    });

    //分页
    var pager=$('#tt').datagrid('getPager');
    pager.pagination({
        total:0,
        rows : 0,
        pageNumber : 1,
        pageList : [ 10,20,30 ],// 可以设置每页记录条数的列表
        onBeforeRefresh: function () {  
        },  
        onSelectPage: function (pageNumber, pageSize) {//分页触发  
            find(pageNumber, pageSize);  
        }
    });
}

function find(pageNumber, pageSize)
{
    if(validate())
    {
        $("#tt").datagrid('getPager').pagination({pageSize : pageSize, pageNumber : pageNumber});//重置
        $("#tt").datagrid("loading"); //加屏蔽
        $.ajax({
            type : "POST",
            dataType : "json",
            url : basePath+"/prepay/prepayPageList.html",
            data : {
                'page' : pageNumber,
                'rows' : pageSize

            },
            success : function(data) {
                $("#tt").datagrid('loadData',pageData(data.rows,data.total));//这里的pageData是我自己创建的一个对象,用来封装获取的总条数,和数据,data.rows是我在控制器里面添加的一个map集合的键的名称
                var total =data.total;
                $("#tt").datagrid("loaded"); //移除屏蔽
            },
            error : function(err) {
                $.messager.alert('操作提示', '获取信息失败...请联系管理员!', 'error');
                $("#tt").datagrid("loaded"); //移除屏蔽
            }
        });
    }
}


functionpageData(list,total){
    var obj=new Object();
    obj.total=total;
    obj.rows=list;
    return obj;
}


控制器:

      /**
     * 查询订单并且分页
     * @return
     * @throws ParseException
     */
    @RequestMapping("/prepayPageList")
    @ResponseBody这里必须要返回这个,要不然的话获取不到你返回的json数据
    public Map searchPrepayPage(HttpServletRequest request,Integer page,Integer rows,PrepayTicketTradeRecord pr){//蓝色的就是你在ajax提交的时候传递的数据
        //设置当前页
        int intPage=page==null||page<=0?1:page;
        //设置每页显示的数量
        int intPageSize=rows==null||rows<=0?10:rows;;
  
        
        List list=prepayTicketTradeService.queryPrepayPageList(pr, intPage,intPageSize);//传进去的page要进行处理

           
        if(list!=null){
            Map result = new HashMap() ;
            result.put("total",prepayTicketTradeService.queryPrepayCount(pr));
            result.put("rows", list);
            return result;//这个就是你在ajax成功的时候返回的数据,我在那边进行了一个对象封装

        }
        return null;
        
    }



prepayTicketTradeService.queryPrepayPageList这个方法


 
    @Override
    public List queryPrepayPageList(PrepayTicketTradeRecord prepay,Integer pageNo, Integer pageSize){
        if(pageNo!=null&&pageSize!=null){
            pageNo = pageNo < 1? 1:pageNo;//三元表达式,如果pageNo小于1,pageNo值就为1 否则就是传递进来的pageNo
            pageSize = pageSize < 1 ? SystemConstant.PAGESIZE:pageSize; //三元表达式 如果pageSize小于1,就去取枚举里面的pageSize,否则就是传递进来的pageSize
            int firstRow = (pageNo - 1) * pageSize;
            if(prepay==null){
                prepay=new PrepayTicketTradeRecord();
            }
            prepay.setFirstRow(firstRow);
            prepay.setRowSize(pageSize);

        }
        
        return prepayTicketTradeDao.queryPrepayPageList(prepay);
    }


mybatis的分页sql

 
   


还有就是要在springmvc中配置json


        
       
            
                
                
            

        

        
        
            
                                     class="org.springframework.web.servlet.view.InternalResourceViewResolver">
                    
                    
                

            

        

        
    



    



 

你可能感兴趣的:(整理)