怎么实现根据combobox的选择,显示不同的列表

怎么实现根据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都是一样的,这个是不可取的