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

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

这种样式的——

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. nodejs模拟http-post文件的方法示例

    var fs = require("fs"); var http = require('http'); function PostFileToServer(sFileName, d ...

  2. 一种Javascript解释ajax返回的json的好方法

    通常ajax请求返回的格式为json或者xml,如果返回的是json,则可以通过转换成javascript对象进行操作,如下: 1.ajax请求的controller实现 @RequestMappin ...

  3. ios 页面传值4种方式(一) 之全局变量

    通用的是用代理的方式实现页面传值,但是有时候利用其它方式也可以很巧妙的解决问题,页面传值一共有4种方式: 1.使用全局变量, SharedApplication,定义一个变量来传递. 2.使用文件,或 ...

  4. hdu 1565(状态压缩基础题)

    题意:容易理解. 分析:这是我做的状态压缩第二题,一开始超内存了,因为数组开大了,后来超时了,因为能够成立的状态就那么多,所以你应该先把它抽出来!!总的来说还是比较简单的!! 代码实现: #inclu ...

  5. C# "error CS1729: 'XXClass' does not contain a constructor that takes 0 arguments"的解决方案

    出现这种错误的原因时,没有在子类的构造函数中指出仅有带参构造函数的父类的构造参数. 具体来讲就是: 当子类要重用父类的构造函数时, C# 语法通常会在子类构造函数后面调用 : base( para_t ...

  6. Heilmeier's criteria

    介绍个Criteria:Heilmeier's criteria 在Alex Smola 的  SML: Scalable Machine Learning 课程网页上看到的,写的非常好. Heilm ...

  7. Spring3 整合Quartz2 实现定时任务

    一.Quartz简介 Quartz是一个由James House创立的开源项目,是一个功能强大的作业调度工具,可以计划的执行任务,定时.循环或在某一个时间来执行我们需要做的事,这可以给我们工作上带来很 ...

  8. 【原创译文】基于Docker和Rancher的超融合容器云架构

    基于Docker和Rancher的超融合容器云架构 ---来自Rancher和Redapt 超融合架构在现代数据中心是一项巨大的变革.Nutanix公司发明了超融合架构理论,自从我听说他们的“iPho ...

  9. SpringMVC处理Date类型的成员变量方法

    原文链接:http://www.tuicool.com/articles/aYfaqa 在使用 SpringMVC 的时候,我们可能需要将一个对象从 View 传递给 Controller .而当这个 ...

  10. 动软代码生成与 EntityFramework 实体生成模板

    有用到EntityFrameWork的同学们,可以用用. 实体工程中添加EF6的dll 还有 ValidBox4Mvc.ValidRules.dll应用到项目中,此dll下载地址:http://www ...