EXTjs 分页加条件查询

最新推荐文章于 2019-03-08 18:03:31 发布

最新推荐文章于 2019-03-08 18:03:31 发布 · 183 阅读

文章标签：

#EXT #json

EXTjs 专栏收录该内容

1 篇文章

订阅专栏

本文介绍如何使用ExtJS实现高效的数据分页显示及条件查询功能，详细解析了JsonStore配置、参数传递机制及服务器端分页逻辑，帮助开发者快速掌握ExtJS中的数据展示技巧。


var store = new Ext.data.JsonStore({
	url : "supplier_queryListUp",
	root : "rows",
	totalProperty:"totalProperty",//总条数
	fields: [{
		name: 'id'
	},{
		name: 'supplier'
	},{
		name: 'linkmanName'
	},{
		name: 'linkmanSex'
	},{
		name: 'phoneCode'
	},{
		name: 'address'
	},{
		name: 'remark'
	}]
});
store.setBaseParam("factorQuery",false);
		//读取数据
store.load({
	params:{start:0, limit:_pageSize}
});

root:'rows'
{rows:{{id:1,supplier:2},{},,{}}}
json格式是这样的意思是rows里的每一个子元素就对应的一行
ext会自动添加到一行上面

totalProperty:
这个是数据总条数用来进行分页的只要在json中传入
{totalProperty:10}
就可以了
totalProperty 与 rows是同级的数组元素可以拼在一起

分页查询


text : "查看",
iconCls :"cwms-query",
tooltip : "根据条件查询人员档案信息",
listeners:{
							"click":function(){
								var _tbar = grid.getTopToolbar();
								var _name = _tbar.items.get(1).getValue();
								var _link_name = _tbar.items.get(4).getValue();
								var _link_phone = _tbar.items.get(7).getValue();
								grid.getStore().baseParams={'supplier.supplier':_name,
										'supplier.linkmanName':_link_name,
										'supplier.phoneCode':_link_phone,
										'factorQuery':true};
								store.load();
	}
}

这里需要注意的是查询后不是onload 而是load onload 是把已有的值发过去是不会替换内容的所以如果用onload 你只能查询一次这个问题也困扰了我很久而load是每次都会替换新值这里分页的时候也会自动保存内容这些内容是可以在服务器端接收的清空条件也是一样的原理

转换成字符串前提json包一定要导好这里就不提供了到处有下载


public static String getJsonList(PageBean pageBean){
		JSONArray jsonArray = JSONArray.fromObject(pageBean.getData());
		String result = "{totalProperty:"+pageBean.getCout()+",rows:"+jsonArray+"}";
		return result;
	}

pageBean.getCout() 是总条数

下面是重点使数据能够翻页的
ext表格查询时会将start 这个参数发到服务器这是起始条数
拿到这一个很容易就可以判断页了


public static int PAGE_SIZE = 12;

	public static int getCurrentPage(int start){
		int currentPage = 1;
		if(start!=0){
			currentPage = start/PAGE_SIZE+1;
		}
		return currentPage;
	}

就能返回一个当前页数了页数都能返回了翻页就解决了

最后总结一下服务器接收的参数只有start 和条件查询参数
服务器发送的只有查到数据与总条数
其他的都不用管 EXT帮你全自动运行
小弟摸索了很久拿出来分享一下在网上找了很多都不全这个应该算是很全了吧