Ext中左侧tree与右侧grid，grid分页问题

代码实现：

grid.js
Ext.onReady(function(){
			//* 数据层回送的数据格式：{"datas":[["282828453f13122f013f131232210001","张三","1","北京上地",1],["282828453f16f3f1013f16f3f4780001","张三","1","北京上地",2],["282828453f1c2a85013f1c2a89cb0001","张三2","1","北京上地2",3],["282828453f1c2bbb013f1c2bbdd20001","张三2","1","北京上地2",4]],"count":5}
			//* 采用下标索引的解决方案
			//创建jsonStore
			jsonStore = new Ext.data.JsonStore({
				url:path+"userAction.do?method=query",					//指定数据加载的位置
				root:'datas',								//指定数据来源于map中哪个key的值，只有返回数据类型为Map时需要设置该项
				totalProperty:'count',						//总记录数
				fields:['0','1','2','3']		//指定记录中有什么字段
			});
			//在加载数据时同时设置从哪条记录开始，每页显示多少条记录，设置第一次数据加载时显示的页数和每页显示的记录条数
			//jsonStore.load({params:{start:0,limit:4}});	    //必须将仓库load，否则没有数据
			
			//声明Grid表格,创建全局对象
			mygrid = new Ext.grid.GridPanel({
				id:'myGrid',	
				title:'员工表',
				width:600,
				height:300,
				renderTo:'grid',						//将grid渲染到body体中Ext.getBody()
				store:jsonStore,							//指定数据来源的仓库
				sm:new Ext.grid.RowSelectionModel({singleSelect:true}),//设置单选模式
				cm:new Ext.grid.ColumnModel({
					columns:[
						//* id设置该列的id，必须唯一；相当于<tr id="uid">
						//* dataIndex设置该列的数据来源，来源于仓库中的哪一列
						//* header设置该列的名称
						//* sortable设置该列是否排序，true为排序，默认为false
						//* renderer设置该字段的显示效果，包括值的替换以及显示html效果等等
						//* new Ext.grid.RowNumberer()给grid添加编号
						new Ext.grid.RowNumberer(),
						{	id:'uid',
							dataIndex:'0',
							sortable:true,
							header:'编号',
							width:200
						},
						{	id:'name',
							dataIndex:'1',
							sortable:true,
							header:'姓名'
						},
						{	id:'sex',
							dataIndex:'2',
							header:'性别',
							//指定该列排序
							sortable:true,
							//通过对字段的渲染修改字段的显示效果
							renderer:function(v){
								if(v=="1"){
									return "<font color='red'>男</font>"
								}
								else{ 
									return "<font color='green'>女</font>"
								}
							}
						},
						{	id:'address',
							dataIndex:'3',
							header:'地址'
						}
					]
				}),
				bbar:new Ext.PagingToolbar({
					store:jsonStore,
					pageSize:4,
					displayInfo:true,
					plugins: new Ext.ux.ProgressBarPager()
				}),
				buttons:[
					{ 
						text:'查询',
					  	handler:function(){
					  		//alert("打开查询功能窗体...");
					  		queryWind.show();
					  	}
					},
					{
						text:'修改',
						handler:function(){
							var rec = grid.getSelectionModel().getSelected();
							//如果没有选中要删除的内容，提示请先选择要删除的行
							if(!rec){
								Ext.Msg.alert("提示信息","请选择要修改的记录!");
								return false;
							}
							//获取当前要修改的记录的信息，并填充到编辑窗口中的对应项
							var formFields = editWind.items.get(0).items;
							formFields.get(0).setValue(rec.get("0"));
							formFields.get(1).setValue(rec.get("1"));
							formFields.get(2).setValue(rec.get("2"));
							formFields.get(3).setValue(rec.get("3"));
							editWind.show();
						}
					},
					{
						text:'添加',
						handler:function(){
							//alert("添加功能实现...");
							addWind.show();
						}
					},
					{
						text:'删除',
						handler:function(){
							//alert("删除功能实现...");
							var record = grid.getSelectionModel().getSelected();
							//如果没有选中要删除的内容，提示请先选择要删除的行
							if(!record){
								Ext.Msg.alert("提示信息","请选择要删除的记录!");
								return false;
							}
							//提示是否要删除信息
							Ext.Msg.show({
								title:'友情提示',
								msg:'确定要删除该记录吗？',
								buttons:Ext.Msg.YESNOCANCEL,
								fn:function(btn){
									if(btn=='yes'){
										//获取当前要删除的记录的id
										var uid = record.get("0");
										//通过ajax方式发送请求并携带参数
										Ext.Ajax.request({
											url:path+"userAction.do?method=del",
											method:'post',
											params:{id:uid}, //参数名:参数值
											success:function(response,opts){
												//获取到所有的页面输出信息
												var obj = Ext.decode(response.responseText);
												if(obj.status=="true"){
													Ext.Msg.alert("提示","删除成功！");
													//将行记录从jsonStore中移除
													jsonStore.remove(record);
													jsonStore.reload();//重新加载数据
												}else{
													Ext.Msg.alert("提示","删除失败！");
													return false;
												}
											},
											failure:function(){
												//只有400/500等才会执行该方法 ，只要访问到了资源则就是成功
												Ext.Msg.alert("提示","删除失败！");
											}
										});
										
									}
								},
								icon:Ext.MessageBox.WARNING
							});
						}
					}
				]
			});
			//创建查询窗体中显示的form表单元素控件
			queryForm = new Ext.FormPanel({
				id:'queryForm',//设置表单的id
				//进行一些默认属性设置，xtype属性设置表单元素的类型；width属性设置表单元素的宽度；lableSeparator属性设置表单元素lable的分隔符
				defaults:{	
					xtype:'textfield',
					width:126,
					labelSeparator:':'
				},
				labelAlign:'right',
				//设置表单中的元素项
				items:[
					{
						name:'name',
						fieldLabel:'姓名'
					},
					{
						name:'sex',
						fieldLabel:'性别',
						xtype:'combo',
						triggerAction:'all',
						mode:'local',
						store:new Ext.data.ArrayStore({
							id:0,
							data:[['','不限'],['0','女'],['1','男']],
							fields:['id','ss']
						}),
						valueField:'id',
						displayField:'ss',
						hiddenName:'sex'
					},
					{
						name:'address',
						fieldLabel:'地址'
					}
				]
			});
			
			//创建查询窗体
			queryWind = new Ext.Window({
				title:'查询',
				width:'300',
				height:'200',
				autoHeight:true,//自动调整高度
				closeAction:'hide',
				items:[queryForm],//设置窗体中显示的内容，这里设置为显示一个表单form控件
				buttons:[
					{
						text:'查询',
						handler:function(){
							//alert("查询功能实现...");
							//从表单中获取所有的属性
							var attrs = queryForm.getForm().getFieldValues();
							//设置从第几页开始
							attrs.start = 0;
							attrs.limit = 5;
							attrs.limit2 = 3;
							attrs = Ext.encode(attrs);
							alert("所有的参数，包括自定义的参数："+attrs);
							queryWind.hide();
						}
					},
					{
						text:'取消',
						handler:function(){
							queryWind.hide();
						}
					}
				]
			});
		});

tree.js
Ext.onReady(function(){
	var t2 = new Ext.tree.TreePanel({
		title:'菜单项',
		width:300,
		height:200,
		renderTo:'tree',
		dataUrl:path+'treeDemoAction.do?method=query',
		root:{
			id:'root',
			text:'公司名称',
			nodeType:'async'
		},
		rootVisible:true,//是否显示根节点
		listeners:{
			click:function(node,e){
				if(node.isLeaf()){
					//alert(">>>>>>>>>>"+node.text+","+node.id);
					//获取到数据仓库
					var store = mygrid.getStore();
					//查找仓库中是否存在某个参数，存在则清除
					for (var key in store.baseParams) { 
						if (key && key.indexOf('tid') != -1) { 
							delete store.baseParams[key]; 
						} 
					}
					//如果参数值不为空则设置参数
					if (node.id) {
						store.setBaseParam('tid', node.id); 
					}
					
					mygrid.getStore().load({
						params:{start:0,limit:4,tid:node.id},
						proxy:new Ext.data.HttpProxy({
					        url : "treeDemoAction.do?method=query"
					    })
					});
				}	
			}
		}
	});
	//展开根节点下的节点
	t2.getRootNode().expand();
});