PagingToolbar带参数的分页

PagingToolbar带参数的分页

一般在分页的时候，会指定两个参数，Start与Limit一个是第几条记录开始，一个是一个页面最多几条记录，一般来说这两个条件已经够了，但是如果你要进行有多余条件查询的时候，就要传递额外的参数过去 了。

/**
 * ********************************************************************************************
 * UserQueryFn.js
 */
function userQueryFn(tabPanel) {
	
	// 创建记录模型
	var user = new Ext.data.Record.create([
		{name:"id",mapping:"id"},
		{name:"name",mapping:"name"},
		{name:"password",mapping:"password"}
	]);
	
	// 创建数据存储器
	var store = new Ext.data.Store({
		url:"User_queryOnCondition.action",
		reader:new Ext.data.JsonReader({
			id:"id",
			root:"users",
			totalProperty:"recordSize"
		},user)
	});
	
	// 查询条件区域
	var queryPanel = new Ext.form.FormPanel({
		baseCls: 'x-plain',
		layout:"column",
		items:[
			new Ext.form.Label({
				text:"查询条件"
			}),
			new Ext.form.ComboBox({
				triggerAction :"all",
				selectOnFocus:true,
				editable:false,
				store:new Ext.data.SimpleStore({
					fields:["queryL","queryV"],
					data:[
						["id","id"],
						["用户名","name"],
						["密码","password"]
					]
				}),
				typeAhead:true,
				displayField:"queryL",
				hiddenName:"queryCondition",
				valueField:"queryV",
				mode:"local",
				readOnly:true
			}),
			new Ext.form.Label({text:"查询值"}),
			new Ext.form.TextField({
				id:"queryValue",
				name:"queryValue"
			})
		]
	});
	
	// 创建列模型
	var colModel = new Ext.grid.ColumnModel([
		{header:"用户ID",dataIndex:"id",sortable:true},
		{header:"用户名",dataIndex:"name",sortable:true,	width:300},
		{header:"密码",dataIndex:"password",sortable:true}
	]);
	
	// 主显示区
	var userQueryPanel = new Ext.grid.EditorGridPanel({
		width:800,
		height:370,
		frame:true,
		store:store,
		cm:colModel,
		autoExpandColumn:3,
		bbar:new Ext.PagingToolbar({
			pageSize : 10,
			displayInfo:true,
			store:store,
		    displayMsg : '此页显示记录第{0}条到第{1}条，共{2}条',
		    emptyMsg : '没有任何用户记录',
		    firstText : '首页',
		    prevText : '上一页',
		    nextText : '下一页',
		    lastText : '尾页',
		    refreshText : '刷新'
		})
	});
	
	var tabPage = tabPanel.add({
		title:"用户查询",
		closable:true,
		tbar:[
			queryPanel,
			{text:"搜索",handler:function() {
				store.load({
					params:{
						"start":0,
						"limit":10,
						"queryCondition":Ext.get("queryCondition").dom.value,
						"queryValue":Ext.get("queryValue").dom.value
					}
				});
			}}
		],
		items:userQueryPanel
	});
	// 额外参数传递
	store.on('beforeload', function() {
	       this.baseParams = {"queryCondition":Ext.get("queryCondition").dom.value,"queryValue":Ext.get("queryValue").dom.value};
	}); 
	
	tabPanel.setActiveTab(tabPage);
}