Extjs 4 MVC自定義參數存儲負載監聽器

Question

在我的控制器裏面我有用戶點擊項目後運行的函數，它加載一個商店並創建/填充TabPanel和DataView（它的工作原理）。當用戶只點擊一個指定項目（if子句）時，我想分割存儲並使用2個DataView創建2個面板。我如何傳遞自定義參數（record.data.name）來存儲偵聽器，以便我可以檢查哪個項目被點擊？或者也許有不同的方法來實現我想要的？這裏是我的控制器代碼：

init: function() { 
    this.control({ 
     'gallery_menu': { 
      itemclick: this.show_gallery 
     } 
    }); 
}, 
imageStoreLoaded: function(ImageStore, store1, store2) { 


}, 
show_gallery: function(view, record, item, index, e, opts) { 


    Ext.getCmp('hania-viewport').setLoading('Loading data...'); 

    var tabb = Ext.ComponentQuery.query('.gallery_panel'); 

    var ImageStore = Ext.create('Gallery.store.Images'); 

    ImageStore.load({url: 'myphoto/index.php/api/feed/json/' + record.data.uuid}); 

    var gallery_view; 

    if (record.data.name == 'Specified_item1') { 
     var store1 = Ext.create('Gallery.store.Images'); 
     var store2 = Ext.create('Gallery.store.Images'); 

     //THIS WONT WORK - STORE IS NOT LOADED YET; 
     ImageStore.each(function(r) { 
       if (r.data.name.substring(0, 2) == 'PS') { 
        console.log('PS'); 
        store1.add(r.copy()); 
       }else{ 
        console.log('NOT PS'); 
        store2.add(r.copy()); 
       }    
     }); 

     //IF I ADD LISTENER HOW CAN I RETURN/REFERENCE store1, store2 ??? 
     //OR how can i pass record.data.name so i could check which item was clicked? 
     ImageStore.addListener('load',this.imageStoreLoaded, this); 

     var panel1 = Ext.widget('gallery_view', { 
      title: 'xxx', 
      autoScroll: true, 
      store: store1, 
      flex: 1 
     }); 


     var panel2 = Ext.widget('gallery_view', { 
      title: 'yyy', 
      autoScroll: true, 
      store: store2, 
      flex: 2 
     }); 

     gallery_view = Ext.create('Ext.panel.Panel',{ 
      id: record.data.uuid, 
      title: 'abc', 
      layout: {     
       type: 'hbox', 
       pack: 'start', 
       align: 'stretch' 
      }, 
      closable: true, 
      autoScroll: true, 
      items: [panel1, panel2] 
     }); 

    }else{ 

     gallery_view = Ext.widget('gallery_view', { 
      title: record.data.name + ' - Photo Gallery', 
      id: record.data.uuid, 
      closable:true, 
      scrollable:true, 
      autoScroll: true, 
      store: ImageStore 
     }); 
    } 

    if (tabb[0].down('#' + record.data.uuid)) { 
     tabb[0].setActiveTab(record.data.uuid); 
    }else{ 
     tabb[0].add(gallery_view); 
     tabb[0].setActiveTab(gallery_view); 
    }; 

} 

Answer 1

And the code: 


show_gallery: function(view, record, item, index, e, opts) { 


    Ext.getCmp('hania-viewport').setLoading('Loading data...'); 

    var tabb = Ext.ComponentQuery.query('.gallery_panel'); 

    var ImageStore = Ext.create('Gallery.store.Images'); 

    ImageStore.load({url: 'myphoto/index.php/api/feed/json/' + record.data.uuid}); 

    var gallery_view; 

    if (record.data.name == 'Do kogo jestem podobna?') { 
     var store1 = Ext.create('Gallery.store.Images'); 
     var store2 = Ext.create('Gallery.store.Images'); 

     function doStuff() { 

      console.log(ImageStore); 

      ImageStore.each(function(r) { 
       if (r.data.raw_name.substring(0, 2) == 'PS') { 
        console.log('PS'); 
        store1.add(r.copy()); 
       }else{ 
        console.log('NOT PS'); 
        store2.add(r.copy()); 
       }    
      }); 

      console.log(store1); 
      console.log(store2); 
     } 


     ImageStore.addListener('load',doStuff, this); 

     var view1 = Ext.widget('gallery_view', { 
      title: 'xxx', 
      store: store1, 
      flex: 1 
     }); 

     var panel1 = Ext.create('Ext.panel.Panel',{ 
      title: 'Tata', 
      items: view1, 
      flex: 1 
     }); 

     var view2 = Ext.widget('gallery_view', { 
      //autoScroll: true, 
      store: store2, 
      flex: 1 
     }); 

     var panel2 = Ext.create('Ext.panel.Panel',{ 
      title: 'Mama', 
      items: view2, 
      flex: 1 
     }); 

     gallery_view = Ext.create('Ext.panel.Panel',{ 
      id: record.data.uuid, 
      title: 'Do kogo jestem podobna?', 
      width: 800, 
      bodyStyle: 'padding: 25px;', 
      layout: {     
       type: 'hbox', 
       pack: 'start', 
       align: 'stretch' 
      }, 
      closable: true, 
      autoScroll: true, 
      items: [panel1, panel2] 
     }); 

    }else{ 

     gallery_view = Ext.widget('gallery_view', { 
      title: record.data.name + ' - Photo Gallery', 
      id: record.data.uuid, 
      closable:true, 
      scrollable:true, 
      autoScroll: true, 
      store: ImageStore 
     }); 
    } 

    if (tabb[0].down('#' + record.data.uuid)) { 
     tabb[0].setActiveTab(record.data.uuid); 
    }else{ 
     tabb[0].add(gallery_view); 
     tabb[0].setActiveTab(gallery_view); 
    }; 

}