基于对象的EXT组件间通信

基于对象的EXT组件间通信

问题提出:主界面上有上下两个gridPanel,在点击上面的gridPanel的时候,触发下面的gridPanel事件,如联动表格

解决方案:

1.在 GridPanel_1 中注册一个事件

this.addEvents({'onClickGridRow':true});

2.获取GridPanel_1的行点击事件

this.on({'rowclick':this.onGetSelectionModel,scope:this});

3.GridPanel_1 行点击事件函数获取行的记录,并触发自定义事件

onGetSelectionModel:function(){

      var sm = this.getSelectionModel();

      var record=sm.getSelected();

   this.fireEvent('onClickGridRow',record);

}

4.在父组件中获取自定义事件

this.aGrid = this.items.itemAt(0);

this.aGrid.on({'onClickGridRow':this.onRecordFromGrid,scope:this});

5.父组件自定义事件处理函数中调用gridPanel_2的方法

,onRecordFromGrid:function(record){

 this.bGrid = this.items.itemAt(1);

 this.bGrid.refreshBGrid(record);

6.在gridPanel_2中定义事件处理方法

,refreshBGrid:function(record){

 alert(record.get('id'));

 this.getStore().baseParams['id'] = record.get('id');

 this.getStore().reload();