怎么实现根据combobox的选择,显示不同的列表
初学ext,请教怎么实现根据combobox的选择,查询出不同的列表,比如combobox里的是意甲、英超,根据不同选择查询出不同联赛的球队的列表,我的代码:
[code="java"]
//填充Combobox
var lRecordType = Ext.data.Record.create([ {
name : 'leagueId',
type : 'float',
mapping : 'leagueId'
}, {
name : 'name',
type : 'string',
mapping : 'name'
}]);
var lStore = new Ext.data.Store( {
proxy : new Ext.data.HttpProxy( {
url : 'admin/getLeagueList.action'
}),
// set up the JsonReader
reader : new Ext.data.JsonReader( {
root : 'list',
totalProperty : 'totalSize',
id : 'leagueId'
}, lRecordType)
});
lStore.load();
var leagueCombox = new Ext.form.ComboBox( {
id:'leagueType',
name:'leagueType',
fieldLabel:'赛事类别',
store:lStore,
displayField: 'name',
valueField: 'leagueId',
hiddenName:'leagueId',
typeAhead:true,
mode:'local',
triggerAction:'all',
model:'local',
selectOnFocus:true,
width:135,
listeners:{
select:function(leagueCombox,record,index) {
//combobox发生变化时,根据combobox的值取出球队列表(但列表不能显示)
new TeamGridPanel(leagueCombox.value);
}
}
});
//显示列表
var TeamGridPanel = function(leagueId) {
var teamWindow = new TeamWindow();
var _grid = this;
var recordType = Ext.data.Record.create([ {
name : 'teamId',
type : 'float',
mapping : 'teamId'
}, {
name : 'name',
type : 'string',
mapping : 'name'
}, {
name : 'remark',
type : 'string',
mapping : 'remark'
}]);
//根据Combobox的值取出所属的球队
var url = 'admin/getTeamList.action?leagueId = ' + leagueId;
this.store = new Ext.data.Store( {
proxy : new Ext.data.HttpProxy( {
url : url
}),
// set up the JsonReader
reader : new Ext.data.JsonReader( {
root : 'list',
totalProperty : 'totalSize',
id : 'teamId'
}, recordType)
});
this.store.load();
var sm = new Ext.grid.CheckboxSelectionModel( {
singleSelect : false
});
this.columns = [new Ext.grid.RowNumberer(), {
id : 'teamId',
header : "编号",
width : 75,
sortable : true,
dataIndex : 'teamId'
}, {
header : "球队名称",
width : 175,
sortable : true,
dataIndex : 'name'
}, {
header : "说明",
width : 175,
sortable : true,
dataIndex : 'remark'
},sm];
......
Ext.onReady(function() {
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'under';
new Ext.Viewport( {
layout: 'fit',
items : new TeamGridPanel(0)
});
});
[/code]
现在的问题是当Combobox变化时,能从后台取到数据,但不能显示(第一次加载的时候,如果给items : new TeamGridPanel(5)的时候,能取到球队列表)。
请问在Combobox触发事件时,从后台取到的数据怎么样才能在grid里显示?
[b]问题补充:[/b]
to yourgame:
我这样写[code="java"]
listeners:{
select:function(eventTypeCombox,record,index) {
var tgp = new TeamGridPanel(eventTypeCombox);
tgp.getStore().proxy.conn.url = 'admin/getTeamList.action?leagueId = ' + eventTypeCombox.value;
tgp.getStore().reload();
}
}
[/code]
重新定义了url,后台的数据可以打印,grid不显示,不知道写法是否正确?
[b]问题补充:[/b]
to yourgame:
是grid的数据不显示,后台数据也打印出来了,麻烦指教...
现在看来,问题不是单方面的.要通过调试才知道.可能的话我帮你看看Q3990995
[code="js"]listeners:{
select:function(){
网格.getStore().reload({params:参数条件等});//里面的参数是可选的.这个方法具体请看api,原理就是让grid的store根据条件重新加载就可以了.这样网格就会自动显示新的数据
}
}[/code]
是grid的数据部显示,还是你自定义的组建不显示?
记住 id : 'teamId', 你每次new 一个你自己的组件对象,他们这里的 id都是一样的,这个是不可取的