extjs 4.2 分页和根据查询条件分页 废话不多说直接上代码:
Ext.onReady(getPageList); function getPageList(){ //取得屏幕高度 var BodyH = document.documentElement.clientHeight; var store; //model Ext.define('Bussiness', { extend: 'Ext.data.Model', fields: [ {name: 'docCode', type:'string'}, {name: 'serialNumber', type: 'string'}, {name: 'busiType', type: 'string'}, {name: 'formId', type: 'int'}, {name: 'docDate', type: 'string'}, {name: 'channelId', type: 'string'}, {name: 'sdorgId', type: 'string'}, {name: 'aeraId', type: 'string'}, {name: 'comboCode', type: 'string'}, {name: 'packageId', type: 'string'}, {name: 'seriesNumber', type: 'string'}, {name: 'docStatus', type: 'int'} ] }); //jsonStore store =Ext.create('Ext.data.Store',{ model: 'Bussiness', pageSize:10, proxy:{ type: 'ajax', url:'bussinessInfo_list.action', reader:{ type:'json', totalProperty:'recordCount', //总记录数 root:'recordList' //json数据 } } }); //点击下一页时传递搜索框值到后台 store.on('beforeload', function (store, options) { var keyWord=Ext.getCmp('KeyWord').getValue(); var new_params = { searchText:keyWord }; Ext.apply(store.proxy.extraParams, new_params); }); var grid=Ext.create('Ext.grid.GridPanel', { //title: '业务信息', store: store, id:'myGridPanel', forceFit : true, frame: true, //顶部工具栏 查询输入框 tbar: [{ xtype:'label',text:'请输入关键词:' }, { xtype:'textfield',id:'KeyWord' }, { text:'搜索',handler:function(){ //点击搜索按钮将查询条件传递到后台 var keyWord=Ext.getCmp('KeyWord').getValue(); store.load({params:{start:0,limit:10,foo:'bar',searchText:keyWord}}); } } ], columns: [ {header:'订单号',dataIndex:'docCode'}, {header:'流水号',dataIndex:'serialNumber'}, {header:'业务类型',dataIndex:'busiType'}, {header:'业务功能号',dataIndex:'formId'}, {header:'业务时间',dataIndex:'docDate',renderer:function(value){ return new Date(parseInt(value)).toLocaleString().substr(0,19); }}, {header:'渠道信息',dataIndex:'channelId'}, {header:'部门信息',dataIndex:'sdorgId'}, {header:'区域信息',dataIndex:'aeraId'}, {header:'套餐信息',dataIndex:'comboCode'}, {header:'政策信息',dataIndex:'packageId'}, {header:'受理号码',dataIndex:'seriesNumber'}, {header:'订单状态',dataIndex:'docStatus',renderer:function(value){ switch(value){ case 1: return "已经成功生成销售定单" ; break; case 2: return "生成失败" ; break; default: return "" ; break; } }} ], dockedItems: [{ xtype: 'pagingtoolbar', store: store, // GridPanel中使用的数据 dock: 'bottom', displayInfo: true, emptyMsg:"没有数据", height:BodyH+160, displayMsg:"显示从{0}条数据到{1}条数据,共{2}条数据", store:store }], renderTo: Ext.getBody(), listeners: { itemdblclick: this.handlePanelClick } }); var keyWord=Ext.getCmp('KeyWord').getValue(); store.load({params:{start:0,limit:10,foo:'bar',searchText:keyWord}}); } //当gridpanel列表被点击时调用 function handlePanelClick(grid, rowIndex, e){ var docCode=rowIndex.data.docCode; var status=rowIndex.data.docStatus; window.location.href="bussinessInfo_detailes.action?docCode="+docCode+"&docstatus="+status; }
相关推荐
extjs4.2 分页combo动态条数 源码,不懂的加群
01.教程简介_ExtJS4.2简介_SSH2基本框架搭建 02.编写几个通用的service方法、设计数据库 03.搭建ExtJS的MVC框架 04.主界面的搭建、登录功能和菜单树的生成 05.创建菜单树、前台保存用户信息 06.菜单树响应事件、我的...
ExtJs4.2+Mysql+Struts2+Hibernate3实现分页查询 1.libs目录缺少hibernate核心jar包 2.libs目录缺少struts jar 3.WebRoot目录缺少ExtJs4.2核心类库 以上信息我都在项目里面注明了,因为这些内容的文件太大了,CSDN不...
配合以下博客使用 http://blog.csdn.net/wyx177694333/article/details/36896391
这是本人在学习ExtJS 4.2 过程中做的一个小实例,包含了一些基础的功能: Tree/Grid/分页查询,滚动查询等. 与数据库的连接以及表结构在附件中的说明文档中有写.
我们开发项目的时候,有的时候左边的树结点很多,虽然说有extjs有异步,但还是有结点下面有时长达500个以上,甚至更多,这个时候用分页可以解决这个问题
最近在自学Extjs,做了一个小例子,后台使用SSH,前台是ExtJs,其中包含了很多内容,例如grid,TreeGrid,comboxTree,分页等内容,数据库采用的是mysql,文件中包含了数据库文件,导入mysql数据库即可,希望可以对初学者有一点...
国外论坛下载的。很好用。前台分页插件。extjs3.x适用
这是一款比较实用的前端开发框架,里面功能齐全,自动生成行号,支持checkbox全选,动态选择显示哪些列,支持本地以及远程分页,可以对单元格按照自己的想法进行渲染等。
ExtJS 4.2 Grid组件本身并没有提供单元格合并功能,需要自己实现这个功能。 目录 1. 原理 2. 多列合并 3. 代码与在线演示 1. 原理 1.1 HTML代码分析 首先创建一个Grid组件,然后查看下的HTML源码。 1.1.1 Grid组件 ...
《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计...
深入浅出ExtJS第2版+源码..1 下载EXT发布包 1 1.2 如何查看EXT自带的API和示例 1 1.3 为什么有些示例必须放在服务器上 才能看到效果 2 1.4 Hello World 2 1.4.1 直接使用下载的发布包 2 1.4.2 在项目中使用EXT...
《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计...
扩展ext的分页工具条 带选择页数的配置 采用Ext4.2
2.7. 还差:表头菜单,分页,可编辑表格,去服务器读取数据,改变大小,表格间拖拽,树与表格间拖拽。 3. 歌颂吧!只为了树也要学ext。 3.1. 真的,我是为了树,才开始学ext的。 3.2. 传统是先做出一棵树来。 ...
8.4.1 组件管理及查询:ext.componentmanager与ext.componentquery / 423 8.4.2 焦点管理:ext.focusmanager / 424 8.4.3 z-order管理:ext.zindexmanager与ext.windowmanager / 425 8.4.4 状态管理:ext.state....
4.2. 慢慢来,先建一个form再说 4.3. 胡乱扫一下输入控件 4.4. 起点高撒,从comboBox往上蹦 4.4.1. 凭空变出个comboBox来。 4.4.2. 把select变成comboBox。 4.4.3. 破例研究下comboBox的内在本质哟 4.4.4. ...
4.2. 慢慢来,先建一个form再说 4.3. 胡乱扫一下输入控件 4.4. 起点高撒,从comboBox往上蹦 4.4.1. 凭空变出个comboBox来。 4.4.2. 把select变成comboBox。 4.4.3. 破例研究下comboBox的内在本质哟 4.4.4. 嘿嘿~本地...
4.2. 慢慢来,先建一个form再说 4.3. 胡乱扫一下输入控件 4.4. 起点高撒,从comboBox往上蹦 4.4.1. 凭空变出个comboBox来。 4.4.2. 把select变成comboBox。 4.4.3. 破例研究下comboBox的内在本质哟 4.4.4. 嘿嘿~本地...