两种分页条:每页固定条数的分页条 和 自定义选择每页内容条数的分页条

一、每页固定条数的分页条

这种样式的——

dockedItems: [{
xtype: 'pagingtoolbar',
store: store,   // GridPanel中使用的数据
              dock: 'bottom',
              displayInfo: true }],

二、自定义选择每页内容条数的分页条

这种样式的——

dockedItems: [{
xtype: 'pagingtoolbar',
dock: 'bottom',
displayInfo: true,
items: ['-', '每页', {
xtype: 'combobox',
displayField: 'id',     //获取的内容
valueField: 'value',     //显示的内容
editable: false,       //不允许编辑只能选择
allowBlank: false,       //不允许为空
triggerAction: 'all', //请设置为”all”,否则默认 为”query”的情况下,你选择某个值后,再此下拉时,只出现匹配选项,
//如果设为”all”的话,每次下拉均显示全部选项
width: 60,
listeners: {
render: function (comboBox) {
comboBox.setValue(comboBox.ownerCt.getStore().getPageSize()); //使得下拉菜单的默认值是初始值
},
select: function (comboBox) {
var pSize = comboBox.getValue();
comboBox.ownerCt.getStore().pageSize = parseInt(pSize); //改变PagingToolbar的pageSize 值
comboBox.ownerCt.getStore().load({start: 0, limit: parseInt(pSize)});
}
},
queryMode: 'local',
store: {
fields: ['id', 'value'],
data: [['2', 2], ['5', 5], ['25', 25], ['50', 50]]
}
}, '条'],
store: store    // GridPanel中使用的数据
}],

extjs表格下的分页条——Ext.grid.Panel 的 pagingtoolbar的更多相关文章

  1. Ext.grid.Panel表格分页存储过程

    /*首先需要引入两个Extjs插件类 Ext.ux.data.PagingMemoryProxy和Ext.ux.ProgressBarPager这两个类*/ /*下面是控制弹出窗体放大缩小时窗体居中的 ...

  2. [Extjs] Ext4 Ext.grid.Panel 分页实现(mybatis 分页插件-PageHelper 使用)

    先看图: 页面js代码: var userStore=Ext.create('Ext.data.Store', { storeId:'userStore', fields:['uname', 'ema ...

  3. 【extjs】 ext5 Ext.grid.Panel 分页,搜索

    带有分页,搜索的grid. <%@page language="java" contentType="text/html; charset=UTF-8" ...

  4. Ext.grid.Panel表格分页

    转载:http://www.cnblogs.com/libingql/archive/2012/04/22/2464994.html cshtml @{ Layout = null; } <!D ...

  5. ExtJs 学习之开篇(三)Ext.grid.Panel表格中的处理

    Ext.grid.Panel Ext.create('Ext.grid.Panel',{        title:'测试表格',        width:400,        height:20 ...

  6. 【extjs】 extjs5 Ext.grid.Panel 搜索示例

    先看效果图: 页面js: <script type="text/javascript"> /** * 日志类型 store * */ var logTypeStore ...

  7. 完善ext.grid.panel中的查询功能(紧接上一篇)

    今天的代码主要是实现,Ext.grid.panel中的查询,其实我也是一名extjs新手,开始想的实现方式是另外再创建一个新的grid类来存放查询出的数据(就是有几个分类查询就创建几个grid类),这 ...

  8. Ext.grid.Panel 数据动态改变后刷新grid

    gridPanel中加载的数据分为两种:一种是本地数据加载,那另一种就是后台数据加载. 在表格中增.删.改.查 是必不可少的. 那么数据动态改变后怎样刷新表格中的数据呢. 一.后台取数据 var gr ...

  9. 导出Ext.grid.Panel到excel

    1.客户端定义,基本的想法是form提交表格头定义,数据,以json方式传输 Ext.grid.Panel.addMembers({ exportExcel:function(options){ if ...

随机推荐

  1. Intent传递数据

    方式比较多,先看看代码,一会儿再总结. activity_main.xml <RelativeLayout xmlns:android="http://schemas.android. ...

  2. bzoj 3809 Gty的二逼妹子序列(莫队算法,块状链表)

    [题意] 回答若干个询问,(l,r,a,b):区间[l,r]内权值在[a,b]的数有多少[种]. [思路] 考虑使用块状链表实现莫队算法中的插入与删除. 因为权值处于1..n之间,所以我们可以建一个基 ...

  3. Http状态码的种类及含义

    1xx 临时响应:2xx 成功:3xx 重定向: 4xx 请求错误: 5xx 服务器错误: http://www.hostspaces.net/wenzhang-detail.php?id=198 常 ...

  4. 转 毛笔字教程ps

    跟大家分享一下毛笔字怎么做出来的,主要通过字体和素材叠加,十分简单,喜欢的一起练习.做完记得交作业. 先看看最终效果: 在网上是不是经常看这些碉堡了的毛笔感觉是不是很羡慕啊,现在我就教大家怎么做出这样 ...

  5. Linker scripts之MEMORY

    1 MEMORY command The MEMORY command describes the location and size of blocks of memory in the targe ...

  6. SCAU 10678 神奇的异或

    10678 神奇的异或 时间限制:1000MS  内存限制:65535K 题型: 编程题   语言: 无限制 Description 在现在这个信息时代,数据是很重要的东西哦~ 很多时候,一条关键的数 ...

  7. matlab 画锥体

    >> plot3(x,y,z); >> [x,y,z]=cylinder([ ],)

  8. MacTerminal快捷键

    [MacTerminal快捷键] 在Mac系统中并没有Home.End等键,所以在使用时并不是特别的顺手,但是有几个键位组合可以使Terminal的操作更加灵活方便. 1.将光标移动到行首:ctrl ...

  9. HDU 4610 Cards (合数分解,枚举)

    Cards Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...

  10. HTTP中缓存相关

    1.客户端如何区分缓存命中和未命中 两种情况下,返回的状态码都是200,客户端有一个方法可以判断,就是使用Date首部,将Date首部与当前时间进行比较,如果响应中时间日期值比较早,客户端可以认为这是 ...