zoukankan      html  css  js  c++  java
  • easyui grid 本地做分页

    背景: 有的数据不是很多,但是有分页的需求,这个时候后台往往没有做分页,我们是一次请求了所有的数据。

    代码:

    dataSource 为 grid 里的数据源

    html部分:

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

      

    js部分:

    //费用类型 grid
    $('#costtype').datagrid({
      data: dataSource.slice(0,1),//每页展示的条数
      columns: [[
      {
        field: 'rowNumbers', title: '序号', 30, formatter: function (value, row, index) {
          var op = $applyList.datagrid('options');
          return op.pageSize * (op.pageNumber - 1) + (index + 1);
        }
      },

      {
        field: 'FeeCategoryName', title: '费用类型', 100, align: 'center'
      },
      {
        field: 'FeeCategoryDescription', title: '费用描述', 300, align: 'center'

        }
      ]],
      rownumbers: true,
      pagination: true//设置分页
    });
    var pager = $('#costtype').datagrid("getPager");
    pager.pagination({
      total: dataSource.length,//数据源总条数
      pageList: [1],
      beforePageText: '第',//页数文本框前显示的汉字
      afterPageText: '页 共 {pages} 页',
      displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记录',
      onSelectPage: function (pageNo, pageSize) {
        var start = (pageNo - 1) * pageSize;
        var end = start + pageSize;
        $('#costtype').datagrid("loadData", dataSource.slice(start, end));
        pager.pagination('refresh', {
          total: dataSource.length,
          pageNumber: pageNo
        });
      }
    });

      

  • 相关阅读:
    Pandas+Numpy 数据中空值的处理操作:判断、查找、填充及删除
    跑新项目时遇到的报错及解决方案
    Java Stream流排序null以及获取指定条数数据
    通信端口Com口被占用的原因分析
    查询sq字段逗号分隔的方式
    IIS及时回收
    oracle中创建sequence指定起始值
    js 面向对象代码
    C# 将html实体编码转换到正常字符 & #40;格式
    DataTable列查询加排序
  • 原文地址:https://www.cnblogs.com/yigexiaojiangshi/p/9634050.html
Copyright © 2011-2022 走看看