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

代码:

dataSource 为 grid 里的数据源

html部分:

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

  

js部分:

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

  {
    field: 'FeeCategoryName', title: '费用类型', width: 100, align: 'center'
  },
  {
    field: 'FeeCategoryDescription', title: '费用描述', width: 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
    });
  }
});

  

easyui grid 本地做分页的更多相关文章

  1. [Ext JS 4] Grid 实战之分页功能

    前言 分页功能的实现有两种途径: 一种是服务端分页方式, 也就是web客户端传递页码参数给服务端,服务端根据页面参数返回指定条数的数据.也就是要多少取多少.这种方式比较适合Grid  的数据量很大,需 ...

  2. schemaeasyui实例:SSh结合Easyui实现Datagrid的分页显示

    查了好多资料,发现还是不全,干脆自己整理吧,最少保证在我的做法正确的,以免误导读者,也是给自己做个记载吧! 克日学习Easyui,发现非常好用,界面很雅观.将学习的心得在此写下,这篇博客写SSh结合E ...

  3. 用PHP+MySQL来做分页的演示

    用php做分页弄懂逻辑关系其实不难,不过我在听课的时候估计是被老师讲的那些变量里的英文单词给听懵了,因为有几个变量的名字都很像,只是换了两三个英文字母而已,有的就少几个这样的,听到一半已经不知道老师讲 ...

  4. SpringMVC结合easyUI中datagird实现分页

    SpringMVC结合easyUI中datagird实现分页 DataGrid以表格形式展示数据,并提供了丰富的选择.排序.分组和编辑数据的功能支持.轻量级,单元格合并.多列标题.冻结列和页脚只是其中 ...

  5. Ajax做分页

    Ajax做分页 用这种ajax做分页的方法比较简单,把代码直接复制就可以,然后根据实际更改一下里面的参数. .设置分页显示显示的样式,显示效果如下. 复制代码 <style type=" ...

  6. SSh结合Easyui实现Datagrid的分页显示

    近日学习Easyui,发现非常好用,界面很美观.将学习的心得在此写下,这篇博客写SSh结合Easyui实现Datagrid的分页显示,其他的例如添加.修改.删除.批量删除等功能将在后面的博客一一写来. ...

  7. LigerUi中的Grid中不分页显示(local)!

    LigerUi中的Grid中不分页显示! grid为local usePager: true,                         //是否分页

  8. 实例:SSh结合Easyui实现Datagrid的分页显示

    近日学习Easyui,发现非常好用,界面很美观.将学习的心得在此写下,这篇博客写SSh结合Easyui实现Datagrid的分页显示,其他的例如添加.修改.删除.批量删除等功能将在后面的博客一一写来. ...

  9. 使用PHP做分页查询(查询结果也显示为分页)

    1.先把数据库里所有的数据分页显示在页面,并在显示数据的表格上方加上查询表单.(加上条件,实现目标结果.) <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

随机推荐

  1. 提交app时候遇到IDFA警告

    1.最近提交app时候遇到如下问题,解决方案: Everything has come to its usual state now. Simply upload your binary as you ...

  2. iOS 音频/视频 学习目录

    参考 iOS原生API  音/视频录制 编辑 https://www.cnblogs.com/kenshincui/p/4186022.html#summary iOS视频编解码常用库比较 http: ...

  3. python学习,day2:字典

    字典的增删改查 # coding=utf-8 # Author: RyAn Bi info = { 'stu1101':'Tenglan Wu', 'stu1102':'longze Luola', ...

  4. BZOJ - 2741 分块维护最大连续异或和

    题意:给定\(a[l...r]\),多次询问区间\([l,r]\)中的最大连续异或和\(a_i⊕a_{i+1}⊕...⊕a_{j},l≤i≤j≤r\) 一眼过去认为是不可做的,但题目给出\(n=1.2 ...

  5. 《WCF全面解析》-上册 1-3章 读书笔记

    第一章.WCF简介 ESB全称为Enterprise Service Bus,即企业服务总线.把所有的服务统筹到一个总线里面请求和分发,方便管理. WCF(Windows Communication ...

  6. Django Rest Framework(阿奇)

    Django Rest Framework 一. 什么是RESTful REST与技术无关,代表的是一种软件架构风格,REST是Representational State Transfer的简称,中 ...

  7. 命令行下class redis not found 解决

    1.在命令行下输入 php --ini 2.在浏览器中查看 phpinfo() 可以看出,我  的phpinfo和命令行的就不是一个php.ini文件.因为我有几个版本的php , 并且在环境变量中配 ...

  8. Verilog三段式状态机描述

    时序电路的状态是一个状态变量集合,这些状态变量在任意时刻的值都包含了为确定电路的未来行为而必需考虑的所有历史信息. 状态机采用VerilogHDL语言编码,建议分为三个always段完成. 三段式建模 ...

  9. 学习react心得及总结

    注意学习这个在D盘:小红书第一部分的案例react/new-my-app 小红书第二部分的案例react/make-redux 小红书第三部分的案例react/my-app-higher 并且里面有说 ...

  10. (转)error while loading shared libraries:libmysqlclient.so.18 错误

    error while loading shared libraries:libmysqlclient.so.18错误 新手安装php的时候如果出现这种问题,解决办法很简单,就是查看你的mysql安装 ...