bootstrap-table真分页

灰太狼 2020-11-21 19:29 841阅读 0赞

**1.js代码**

$("#withdraw_table").bootstrapTable({
        //请求方法
        method: 'get',
       //contentType : "application/x-www-form-urlencoded", //post请求加上
       //是否显示行间隔色
      striped: true,
      //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）     
      cache: false,    
      //是否显示分页（*）  
      pagination: true,   
       //是否启用排序  
      sortable: false,    
       //排序方式 
      sortOrder: "asc",    
      //每页的行数
      pageSize: 10,  
      //可供选择的每页的行数（*）    
      pageList: [10, 25, 50, 100],
      //这个接口需要处理bootstrap table传递的固定参数,并返回特定格式的json数据  
      url: "/fic/getWithdraw.do",
      //默认值为 'limit',传给服务端的参数为：limit, offset, search, sort, order Else
      //queryParamsType:'',   
      //查询参数,每次调用是会带上这个参数，可自定义                         
      queryParams: function(params) {
          return {
                //pageNumber ：  当前页（必须）
        	    //pageSize : 每页行数（必须）
                pageNumber: params.offset / params.limit + 1,
                pageSize:params.limit
                //这里可以加上其他参数
                
              };
      },
      //分页方式：client客户端分页，server服务端分页（*）
      sidePagination: "server",
      //是否显示搜索
      search: false,  
      //Enable the strict search.    
      strictSearch: true,
      //Indicate which field is an identity field.
      idField : "id",
      columns:[[// 列
    	   {field: 'id',title: 'id',align: 'center'},
    	   {field: 'userName',title: '用户账号',align: 'center'},
    	   {field: 'realName',title: '真实姓名',align: 'center'},
    	   {field: 'userCode',title: '用户编号',align: 'center'},
    	   {field: 'coinName',title: '转出币种',align: 'center'},
    	   {field: 'addressFrom',title: '转出地址',align: 'center'},
    	   {field: 'number',title: '转出数量',align: 'center'},
    	   {field: 'poundage',title: '手续费',align: 'center'},
    	   {field: 'realNumber',title: '到账数量',align: 'center'},
    	   {field: 'date',title: '转出时间',align: 'center'},
    	   {title:'状态',field:'sate',width:100,align:'center',
               formatter : function(value,row,index) {
                   var id = row.id;
                   if (value == 0){
                       return '<button class="btn btn-info" ' +
                           'onclick="confirmWithdraw(\''+ id + '\')">' +
                           '<i class="icon-money icon-white"></i> 确认到账</button>';
                   }
                   if (value == 1){
                      return '已到账';
                   }
               }}
      ]],
      pagination:true
    
    });

**2.访问的接口必须返回以下参数：**

//bootstrap分页必须返回的数据
            map.put("total",总记录数);
            map.put("rows", 结果集list);

**3.分页对象bean:**

/**
     * 分页对象
     * @author lin
     *  
     */
    public class pageDto {
    	
    	//当前页码
         private Integer pageNumber;
         //每页记录数
         private Integer pageSize;
         
         //每页的第一条记录
         private Integer firstRecord;
         
         
         public Integer getFirstRecord() {
        	 return  (pageNumber-1)*pageSize;
         }
        
    	public Integer getPageNumber() {
    		return pageNumber;
    	}
    	public void setPageNumber(Integer pageNumber) {
    		this.pageNumber = pageNumber;
    	}
    	public Integer getPageSize() {
    		return pageSize;
    	}
    	public void setPageSize(Integer pageSize) {
    		this.pageSize = pageSize;
    	}
    }