bootstrap-table+Thinkphp实现server分页

界面需要:此处不提供文件下载,请自行到官网下载。

<link href="./css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" type="text/css" />

<script src="./js/bootstrap.min.js" type="text/javascript"></script>
<script src="./js/plugins/bootstrap-table/bootstrap-table.min.js" type="text/javascript"></script>
<script src="./js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js" type="text/javascript"></script>

 

前端html代码:

<table id="table"></table>

前端JavaScript:代码

  $('#table').bootstrapTable({
          url: "./infolist", //请求地址
          method: 'GET', //请求
          striped: true,
          cache: false,
          pagination: true,
          sortable: true,
          showHeader : true,
          showRefresh: true,
          clickToSelect: true,
          search: false,
          sidePagination: "server", //客户端client   服务端server
          pageNumber: 1,
          pageList: [10, 15],
          queryParams: function (params) {
              return {
                offset: params.offset,  //页码
                limit: params.limit,   //页面大小
            };
          },
          columns: [{
              field: 'id',
              title: '应用ID',
              width: '10%',
          }, {
              field: 'name',
              title: '应用名称',
          },  {
              field: 'type',
              title: '类型',
              width: '10%',
          },  {
              field: 'status',
              title: '状态',
              width: '10%',
          }, {
              field: 'xznum',
              title: '下载量',
              width: '10%',
          }, {
              field: 'phnum',
              title: '排序号',
              width: '10%',
          }],
      });
      

后端Thinkphp处理:

$limit = trim(I('get.limit'));
$offset = trim(I('get.offset'));
$page = floor($offset / $limit) + 1;
# 获取并且计算 页号 分页大小

$list = M('table')->where(['id'=>1])->page($page,$limit)->select();
# 查询相关数据
$count = M('table')->where(['id'=>1])->count();
# 查询数据条数

$ret = [
        'total' => $list,
        'rows' => $count,
    ];
# 构造返回数据类型
$this->ajaxReturn($ret);
# 返回JSON数据

 

posted @ 2018-07-15 18:09  HULANG-BTB  阅读(1823)  评论(0编辑  收藏  举报