extjs - コンボボックスのドロップダウンリストをレンダリングする方法

Question

配列ストアのフィルタリングに問題があります。

状況

配列ストアを備えた2つのコンボボックスがあります。コンボボックス1とコンボボックス2はどちらもモード「ローカル」であり、事前定義された配列ストアがあります。最初のコンボボックスの行をクリックして選択すると、2番目のコンボボックス（まだ気に入らなかった）にフィルターを適用します。問題は、2番目のコンボボックスがまだデータ（またはhtml）をレンダリングしていないため、フィルターが適用されていないことです。

2番目のコンボボックスをクリックしてから最初のコンボボックスをクリックすると、フィルターが適用されて機能します。

私の質問は、array_store / comboboxを事前にレンダリングする方法ですか？

私は最初にコンボボックスを拡張しようとしましたが、うまくいきませんでした。（コメントされたコードを参照）

var store1 = new Ext.data.ArrayStore({
      fields: ['id','name'],
      data:somedata //array of some data
});

var store2 = new Ext.data.ArrayStore({
      fields: ['id','name'],
      data:somedata //array of some data
});

var combobox1 = {
    name: 'combobox_1',
    xtype: 'combo',
    hiddenName: 'combobox_1',
    store: store1,
    displayField:'name',
    valueField:'id',
    mode:'local',
    triggerAction: 'all',
    allowBlank:true,
    emptyText:'Select...',
    listeners:{
        select: function(st, r){
            var selected = r.get('name');
            var combobox2 = Ext.getCmp('combobox2');
            //combobox2.expand();
            combobox2.store.filter([
               {
                property     : 'name',
                value        : selected,
                anyMatch     : true,
                caseSensitive: false
              }
            ]);
        },
        scope:this
    }
}

var combobox2 = {
    name: 'combobox_2',
    xtype: 'combo',
    hiddenName: 'combobox_2',
    store: store2,
    id: 'combobox2'
    displayField:'name',
    valueField:'id',
    mode:'local',
    triggerAction: 'all',
    allowBlank:true,
    emptyText:'Select...',
}