相關的組合框 - extjs

Question

我想設置一個組合框依賴於其他組合框。我的腳本在第一個組合框中的第一個值工作正常，並在第二個組合框中顯示正確的相關值。但是，當我嘗試更改我的第一個組合框中的值時，它停止工作。

init：function（）{ var me = this;

var roles=[ 
     ['Gen', 'General'], 
     ['Neuro', 'Neurotoxin User'], 
     ['Admin', 'Administrator (System Administrator Only)'] 
    ]; 
    Ext.define('Testfile.model.Role', { 
      extend: 'Ext.data.Model', 
      fields: ['abbr', 'role'] 
     }); 
    var rolesStore = new Ext.data.Store({ 
     model: 'Testfile.model.Role', 
     proxy: { 
      type: 'memory', 
      reader: { 
       type: 'array' 
      } 
     }, 
     data: roles 
    }); 

    var tests=[ 
     [1, 'Gen', 'Test1'], 
     [2, 'Gen', 'Test3'], 
     [3, 'Neuro', 'Test2'] 
    ]; 
    Ext.define('Testfile.model.Test', { 
      extend: 'Ext.data.Model', 
      fields: ['id', 'abbr', 'test'] 
     }); 
    var testsStore = new Ext.data.Store({ 
     model: 'Testfile.model.Test', 
     proxy: { 
      type: 'memory', 
      reader: { 
       type: 'array' 
      } 
     }, 
     data: tests 
    }); 
    me.form=Ext.create('Ext.form.Panel',{ 
       renderTo:document.body, 
       bodyPadding: 10, 
       width: 550, 
       style:'margin:16px', 
       height: 300, 
       title:'Linked Combos', 
       defaults: {xtype:'combo'}, 
           items: [{ 
        fieldLabel: 'Application Role', 
        id:'firstComboID', 
             store:rolesStore, 
        valueField: 'abbr',      
        displayField: 'role',       
        typeAhead: true,         
         forceSelection: true,                 
             allowBlank: false, 
             editable: true, 
        triggerAction: 'all',       
        listeners: { 
              select:{fn:function(combo, value) { 
         var sample = Ext.getCmp('secondComboID');         
       sample.store.filter('abbr', combo.getValue());        
       sample.clearValue();          
       }}         
       }         
       },{       
       fieldLabel: 'Select Test', 
       id:'secondComboID',         
       store:testsStore, 
       valueField: 'id', 
       displayField: 'test', 
       typeAhead: true, 
       forceSelection: true, 
            allowBlank: false, 
            editable: true, 
       triggerAction:'all', 
       lastQuery:'' 
            } 
        ] 
          }); 

    me.container.add(me.form); 
    }, 
}); 

我不知道是什麼問題。有人可以請建議修復我的代碼？

Answer 1

發生了什麼事情是，您將結果集的第2次，第3次，第n次結果集過濾到商店中。爲了讓它按照你想要的方式工作，你需要先用clearFilter（）清除商店的過濾器。

下面是與那件你的代碼的工作示例應用：https://fiddle.sencha.com/#fiddle/tm

sample.store.clearFilter(); 
sample.store.filter('abbr', combo.getValue());