Hi


I have 2 combobox, one state will depend on the first combo box value.

If first combobox value is 1, user needs to select value for combobox 2, if value is 2, then 2nd combo box will allow blank and disabled.

But with my code below, 2nd combo box will not disable and will throw a warning tooltip telling the user it needs a value.

Is this a bug?

Any help would be appreciated.


JSFiddle Link here : https://fiddle.sencha.com/#view/editor&fiddle/2rrv


thanks


PHP Code:

new Ext.form.FormPanel({
    
defaultType'textfield',
    
items: [new Ext.form.ComboBox({
        
store: new Ext.data.SimpleStore({
            
fields: ['val''type'],
            
data: [
                [
'1''Test'],
                [
'2''Test2 ']
            ]
        }),
        
displayField'type',
        
fieldLabel'Type 1',
        
name'subType',
        
hiddenName'subType',
        
id'subTypeId',
        
valueField'val',
        
mode'local',
        
editablefalse,
        
triggerAction'all',
        
emptyText'Sub Type...',
        
selectOnFocustrue,
        
width100,
        
allowBlanktrue,
        
listeners: {
            
'select': function (comborecord) {

                var 
subTypeId Ext.getCmp('subTypeId').getValue();

                
console.log(subTypeId);
                
Ext.getCmp('type2Id').setValue("");

                
console.log(Ext.getCmp('type2Id').allowBlank);

                if (
subTypeId === 2) {
                    
Ext.getCmp('type2Id').allowBlank true;
                    
Ext.getCmp('type2Id').setDisabled(true);
                    
Ext.getCmp('type2Id').setReadOnly(true);

                    
console.log(Ext.getCmp('type2Id').disabled);

                } else {
                    
Ext.getCmp('type2Id').allowBlank false;
                    
Ext.getCmp('type2Id').setDisabled(false);
                    
Ext.getCmp('type2Id').setReadOnly(false);

                }
                
console.log(Ext.getCmp('type2Id'));
                
console.log(Ext.getCmp('type2Id').validate());

            }
        }

    }), new 
Ext.form.ComboBox({
        
store: new Ext.data.SimpleStore({
            
fields: ['val''type'],
            
data: [
                [
'1''Test'],
                [
'2''Test2 ']
            ]
        }),
        
displayField'type',
        
fieldLabel'Type 2',
        
name'subType',
        
hiddenName'subType',
        
id'type2Id',
        
valueField'val',
        
mode'local',
        
editablefalse,
        
triggerAction'all',
        
emptyText'Sub Type...',
        
selectOnFocustrue,
        
width100,
        
allowBlankfalse

    
})],
    
renderToExt.getBody()
});