jqGrid分页

js代码
$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'sys/dept/list',
        datatype: "json",
        colModel: [
            { label: 'xxx', name: 'deptId', index: "dept_id", width: 45, key: true },
            { label: 'xxx', name: 'name', index: "name", width: 75 },
            { label: 'xx', name: 'nameDescribe', width: 80 },
            { label: 'xx', name: 'orderNum', width: 80,},
            { label: 'xx', name: 'parentId', width: 80,},
            { label: 'xx', name: 'delFlag', width: 80,}   
        ],
        onSelectRow: function () {
            //返回选中的id
            selectedRowIndex = $("#" + this.deptId).getGridParam('selrow');
        },
        viewrecords: true,
        height: 385,
        rowNum: 10,
        rowList : [10,30,50],
        rownumbers: true,
        rownumWidth: 25,
        autowidth:true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page",
            rows:"limit",
            order: "order"
        },
        gridComplete:function(){
            //隐藏grid底部滚动条
            $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" });
        }
    });
});

html

<div id="rrapp" v-cloak>
   <div v-show="showList">
      <div class="grid-btn">
         <div class="form-group col-sm-2">
            <input type="text" class="form-control" v-model="d.name" @keyup.enter="query" placeholder="">
         </div>
         <a class="btn btn-default" @click="query">查询</a>

         <a v-if="hasPermission('xxx:xx:x')" class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
         <a v-if="hasPermission('xxx:xx:x')" class="btn btn-primary" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
         <a v-if="hasPermission('xxx:xx:x')" class="btn btn-primary" @click="del"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
      </div>
      <table id="jqGrid"></table>
      <div id="jqGridPager"></div>
   </div>

</div>

后台query查询

public class Query extends LinkedHashMap<String, Object> {
   private static final long serialVersionUID = 1L;
   //当前页码
    private int page;
    //每页条数
    private int limit;

    public Query(Map<String, Object> params){
        this.putAll(params);

        //分页参数
        this.page = Integer.parseInt(params.get("page").toString());
        this.limit = Integer.parseInt(params.get("limit").toString());
        this.put("offset", (page - 1) * limit);
        this.put("page", page);
        this.put("limit", limit);

        //防止SQL注入(因为sidx、order是通过拼接SQL实现排序的,会有SQL注入风险)
        String sidx = (String)params.get("sidx");
        String order = (String)params.get("order");
        if(StringUtils.isNotBlank(sidx)){
            this.put("sidx", SQLFilter.sqlInject(sidx));
        }
        if(StringUtils.isNotBlank(order)){
            this.put("order", SQLFilter.sqlInject(order));
        }

    }


    public int getPage() {
        return page;
    }

    public void setPage(int page) {
        this.page = page;
    }

    public int getLimit() {
        return limit;
    }

    public void setLimit(int limit) {
        this.limit = limit;
    }
}

分页工具类

public class PageUtils implements Serializable {
   private static final long serialVersionUID = 1L;
   //总记录数
   private int totalCount;
   //每页记录数
   private int pageSize;
   //总页数
   private int totalPage;
   //当前页数
   private int currPage;
   //列表数据
   private List<?> list;
   
   /**
    * 分页
    * @param list        列表数据
    * @param totalCount  总记录数
    * @param pageSize    每页记录数
    * @param currPage    当前页数
    */
   public PageUtils(List<?> list, int totalCount, int pageSize, int currPage) {
      this.list = list;
      this.totalCount = totalCount;
      this.pageSize = pageSize;
      this.currPage = currPage;
      this.totalPage = (int)Math.ceil((double)totalCount/pageSize);
   }

   public int getTotalCount() {
      return totalCount;
   }

   public void setTotalCount(int totalCount) {
      this.totalCount = totalCount;
   }

   public int getPageSize() {
      return pageSize;
   }

   public void setPageSize(int pageSize) {
      this.pageSize = pageSize;
   }

   public int getTotalPage() {
      return totalPage;
   }

   public void setTotalPage(int totalPage) {
      this.totalPage = totalPage;
   }

   public int getCurrPage() {
      return currPage;
   }

   public void setCurrPage(int currPage) {
      this.currPage = currPage;
   }

   public List<?> getList() {
      return list;
   }

   public void setList(List<?> list) {
      this.list = list;
   }
   
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值