Extjs三级联动效果

实际上很容易，定义监听事件，触发后更改下一级的数据源即可

/**
* 创建搜索表单
*/
function formPannel () {
   Ext.QuickTips.init();
   Ext.form.Field.prototype.msgTarget = 'side';
   return new Ext.FormPanel({
        labelWidth: 75, // label settings here cascade unless overridden
        url:'save-form.php',
        //frame:true,
      border:false,
        //title: 'Simple Form',
        bodyStyle:'padding:5px;background-color:#d2e0f2;',
        width: 500,
      buttonAlign:'right',
        labelAlign:'right',
        items: [
          {
              xtype:'fieldset',
            title:'查询条件',
            autoHeight:true,
            defaultType: 'textfield',
            items:[
                gameSelect = new Ext.form.ComboBox({
                  fieldLabel: "游戏",
                  hiddenName:'game',
                  store: gameds,
                  valueField:'game_id',
                  displayField:'game_name',
                  editable:false,
                  mode: 'remote',
                  triggerAction: 'all',
                  emptyText:"请选择",
                  selectOnFocus:true,
                  allowBlank:false,
                  blankText:'请选择一款游戏',
                  anchor: '96%',
                  listeners:{
                             select:function(gameSelect){
                                        serverSelect.setValue('');
                              serverds.load({params:{game: gameSelect.getValue()}});
                           }
                          }
               }),serverSelect = new Ext.form.ComboBox({
                  fieldLabel: "所在大区",
                  hiddenName:'area',
                  store: serverds,
                  valueField:'server_id',
                  displayField:'server_name',
                  editable:false,
                  mode: 'local',
                  triggerAction: 'all',
                  emptyText:"请选择",
                  selectOnFocus:true,
                  allowBlank:false,
                  blankText:'请选择大区',
                  anchor: '96%',
                  listeners:{//添加监听事件
                             select:function(o){
                                        serverListSelect.setValue('');
                              serverlistds.load({params:{game: formPanel.form.findField('game').getValue(),server_id:serverSelect.getValue()}});// 重新加载数据源
                           }
                          }
               }),serverListSelect = new Ext.form.ComboBox({
                  fieldLabel: "所在服务器",
                  hiddenName:'server',
                  store: serverlistds,
                  valueField:'list_id',
                  displayField:'list_name',
                  editable:false,
                  mode: 'local',
                  triggerAction: 'all',
                  emptyText:"请选择",
                  selectOnFocus:true,
                  allowBlank:false,
                  blankText:'请选择服务器',
                  anchor: '96%'
               }), {
                  fieldLabel: '玩家人物名',
                  name: 'character',
                  anchor: '96%'
               }, {
                  fieldLabel: '代币数',
                  name: 'emoney',
                  anchor: '96%'
               }
            ]
          }
        ],

        buttons: [{
            text: '查询',
         //查询函数开始
         handler: function(){
                  if(formPanel.form.isValid()){
                     searchds.load({params:{start:0, limit:50, forumId: 4,server: formPanel.form.findField('server').getValue(),character:formPanel.form.findField('character').getValue(),emoney:formPanel.form.findField('emoney').getValue()}});
                     searchds.on('beforeload',function(){
                       Ext.apply(
                       this.baseParams,
                       {
                          server: formPanel.form.findField('server').getValue(),character:formPanel.form.findField('character').getValue(),emoney:formPanel.form.findField('emoney').getValue()
                       });
                     });
                  }
                }
         //查询函数结束
        }]
    });
}