如何根据combo的数据,使得GridPanl加载不同的数据(后台数据加载错误)
[size=large]目前的问题是前台不管如何选择combo数据,尽管参数已经传给后台,但是后台总是返回 else 里面的数据,没有执行判断语句。[size=medium][/size]
希望大家看看,错在哪里。谢谢~[/size][code="java"]
/***********************************前台代码****************************************/
Ext.onReady(function()
{
Ext.QuickTips.init();
var proxy=new Ext.data.HttpProxy({url:'ExtCombodata.jsp'});
var MyRecord = Ext.data.Record.create([
{name: 'id'},
{name: 'name'},
{name: 'occupation'}
]);
var readergrid=new Ext.data.JsonReader({
totalProperty: "results", //totalRecords属性由json.results得到
root: "rows", //构造元数据的数组由json.rows得到
id: "id" //id由json.id得到
},MyRecord
)
//构建Store
var storegrid=new Ext.data.Store({
proxy:proxy,
reader:readergrid,
remoteSort : true,
baseParams : {
jsonData : '11'
}
});
storegrid.reader = '';
// storegrid.load();
var grid = new Ext.grid.GridPanel({
title:"1111111111",
height:300,
width:250,
columns: [
{id:'ids',header: "id", width: 20, sortable: true, dataIndex: 'id'},
{header: "name", width: 75, sortable: true, dataIndex: 'name'},
{header: "occupation", width: 75, sortable: true, dataIndex: 'occupation'}
],
store:storegrid,
autoExpandColumn:2
});
var arr=[ [1, 'AAA'], [2, 'BBB'],[3, 'CCC'] ];
var reader = new Ext.data.ArrayReader({id: 0},[{name: 'value'},{name: 'key'}]);
var store=new Ext.data.Store({
reader:reader
});
store.loadData(arr);
var combo= new Ext.form.ComboBox({
labelStyle: "text-align: 'right';",
fieldLabel:'各个子系统',
editable:false,
triggerAction: 'all',
displayField:'key',
mode: 'local',
store:store ,
listeners:{
select:function(combo, record,index){
alert('Data: '+combo.getValue());
storegrid.reader = readergrid;
if(combo.getValue()=='AAA'){ //这里通过combo的不同选项,向后台传不同的参数
storegrid.baseParams.jsonData = "11";
}else if(combo.getValue()=='BBB'){
storegrid.baseParams.jsonData = "22";
}else{
storegrid.baseParams.jsonData = "33";
}
storegrid.load();
}
}
});
var panelIE=new Ext.FormPanel({
labelWidth: 50,
labelAlign:'center',
frame:true,
width: 300,
height: 400,
defaultType: 'textfield',
renderTo:'div01',
items:[
new Ext.Panel({}),
combo,
grid
]});
})
/***********************************后台代码(ExtCombodata.jsp)*******************************/
<%@ page language="java" contentType="text/html; charset=GB2312"
pageEncoding="GB2312"%>
<%
String aa= request.getParameter("jsonData");
String tempStr="";
// response.getWriter().write(aa);
if(aa=="11"){
tempStr="{ 'results': 3, 'rows': [{ 'id': '1', 'name': 'Bill111', 'occupation': 'Gardener' },{ 'id': '11', 'name': 'Ben', 'occupation': 'Horticulturalist' },{ 'id': '111', 'name': 'Bill', 'occupation': 'Horticulturalist' } ]}";
}else if(aa=="22"){
tempStr="{ 'results': 3, 'rows': [{ 'id': '2', 'name': 'Bill111', 'occupation': 'Gardener' },{ 'id': '22', 'name': 'Ben', 'occupation': 'Horticulturalist' },{ 'id': '222', 'name': 'Bill', 'occupation': 'Horticulturalist' } ]}";
}else{
tempStr="{ 'results': 3, 'rows': [{ 'id': '3', 'name': 'Bill111', 'occupation': 'Gardener' },{ 'id': '33', 'name': 'Ben', 'occupation': 'Horticulturalist' },{ 'id': '333', 'name': 'Bill', 'occupation': 'Horticulturalist' } ]}";
}
response.getWriter().write(tempStr);
%>
[/code]
注意,使用equals来比较
/***********************************前台代码****************************************/
Ext.onReady(function()
{
Ext.QuickTips.init();
var proxy=new Ext.data.HttpProxy({url:'ExtCombodata.jsp'});
var MyRecord = Ext.data.Record.create([
{name: 'id'},
{name: 'name'},
{name: 'occupation'}
]);
var readergrid=new Ext.data.JsonReader({
totalProperty: "results", //totalRecords属性由json.results得到
root: "rows", //构造元数据的数组由json.rows得到
id: "id" //id由json.id得到
},MyRecord
)
//构建Store
var storegrid=new Ext.data.Store({
proxy:proxy,
reader:readergrid,
remoteSort : true,
baseParams : {
jsonData : '11'
}
});
storegrid.reader = '';
// storegrid.load();
var grid = new Ext.grid.GridPanel({
title:"1111111111",
height:300,
width:250,
columns: [
{id:'ids',header: "id", width: 20, sortable: true, dataIndex: 'id'},
{header: "name", width: 75, sortable: true, dataIndex: 'name'},
{header: "occupation", width: 75, sortable: true, dataIndex: 'occupation'}
],
store:storegrid,
autoExpandColumn:2
});
var arr=[ [1, 'AAA'], [2, 'BBB'],[3, 'CCC'] ];
var reader = new Ext.data.ArrayReader({id: 0},[{name: 'value'},{name: 'key'}]);
var store=new Ext.data.Store({
reader:reader
});
store.loadData(arr);
var combo= new Ext.form.ComboBox({
labelStyle: "text-align: 'right';",
fieldLabel:'各个子系统',
editable:false,
triggerAction: 'all',
displayField:'key',
mode: 'local',
store:store ,
listeners:{
select:function(combo, record,index){
alert('Data: '+combo.getValue());
storegrid.reader = readergrid;
if(combo.getValue()=='AAA'){ //这里通过combo的不同选项,向后台传不同的参数
storegrid.baseParams.jsonData = "11";
}else if(combo.getValue()=='BBB'){
storegrid.baseParams.jsonData = "22";
}else{
storegrid.baseParams.jsonData = "33";
}
storegrid.load();
}
}
});
var panelIE=new Ext.FormPanel({
labelWidth: 50,
labelAlign:'center',
frame:true,
width: 300,
height: 400,
defaultType: 'textfield',
renderTo:'div01',
items:[
new Ext.Panel({}),
combo,
grid
]});
})
/***********************************后台代码(ExtCombodata.jsp)*******************************/
<%@ page language="java" contentType="text/html; charset=GB2312"
pageEncoding="GB2312"%>
<%
String aa= request.getParameter("jsonData");
String tempStr="";
// response.getWriter().write(aa);
if(aa.equals("11")){
tempStr="{ 'results': 3, 'rows': [{ 'id': '1', 'name': 'Bill111', 'occupation': 'Gardener' },{ 'id': '11', 'name': 'Ben', 'occupation': 'Horticulturalist' },{ 'id': '111', 'name': 'Bill', 'occupation': 'Horticulturalist' } ]}";
}else if(aa.equals("22")){
tempStr="{ 'results': 3, 'rows': [{ 'id': '2', 'name': 'Bill111', 'occupation': 'Gardener' },{ 'id': '22', 'name': 'Ben', 'occupation': 'Horticulturalist' },{ 'id': '222', 'name': 'Bill', 'occupation': 'Horticulturalist' } ]}";
}else{
tempStr="{ 'results': 3, 'rows': [{ 'id': '3', 'name': 'Bill111', 'occupation': 'Gardener' },{ 'id': '33', 'name': 'Ben', 'occupation': 'Horticulturalist' },{ 'id': '333', 'name': 'Bill', 'occupation': 'Horticulturalist' } ]}";
}
response.getWriter().write(tempStr);
%>