Выпадение дочернего выпадающего списка - extjs

Question

Я установил зависимости между 2 списками. Но проблема, с которой я сейчас сталкиваюсь, - это когда я обновляю свою страницу, вторая сводка (дочерняя) показывает все значения. То, что я хотел бы видеть, - это 2-й должен быть либо серым, либо не показывать никаких значений, если не будет выбрано значение в первом поле со списком (родителем). В моем примере ниже Роли - это родительское поле со списком, а тесты - это дочерние поля. Значения в combobox-тестах должны появляться только в том случае, если выбрано значение в поле со списком Роли.

Ext.onReady(function() { 
var roles=[ 
    ['Adm', 'Administrator'], 
    ['Sci', 'Scientist'], 
    ['Test', 'Tester'] 
]; 
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, 'Adm', 'Test1'], 
    [2, 'Sci', 'Test3'], 
    [3, 'Test', 'Test2'], 
    [4, 'Adm', 'Test4'] 

]; 
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 
}); 
var 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.clearFilter(); 
        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:'' 
    }] 
}); 
Ext.getBody().add(me.form); 

})

Может кто-то пожалуйста, предложите исправление для сценария, чтобы включить эту функцию?

Answer 1

Первоначально установлено «disabled: true» для вашего второго комбо, а затем в функции «select» первого комбо включить его - «sample.setDisabled (false)»;