ExtJs 3 - 添加监听器

Question

我想完成：

• 当ComboBox中的某些项目被选中，隐藏形式或完整的Div中的一些其他字段。

这是我的组合框：

var typeIDcombo = new Ext.form.ComboBox({
        fieldLabel: 'Type',
        name: 'typeid',
        store: typeIdData,
        displayField:'name',
        valueField: 'typeid',
        hiddenName: 'typeid',
        typeAhead: false,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'Selecteer het type link',
        forceSelection: true,
        selectOnFocus:true,
        allowBlank: false,
        value: 'Selecteer een type',
    });

我已将侦听器添加到我的 var form = new Ext.FormPanel。但这不起作用。

listeners: [{
    'select' : function(field,nval,oval) {
     alert(field);
    }],

有人知道解决方案吗？提前致谢。

Answer 1

试试这个：

typeIDcombo.on('select', function(combo) {
    if (combo.value == 'ABC') { 
        Ext.getCmp('field').show();
        Ext.getCmp('form').doLayout();
    } else {
        Ext.getCmp('field').hide();
        Ext.getCmp('form').doLayout();
    }
});

Answer 2

正如 Warung 所写，应该这样做：

var typeIDcombo = new Ext.form.ComboBox({
    fieldLabel: 'Type',
    name: 'typeid',
    store: typeIdData,
    displayField:'name',
    valueField: 'typeid',
    hiddenName: 'typeid',
    typeAhead: false,
    mode: 'local',
    triggerAction: 'all',
    emptyText:'Selecteer het type link',
    forceSelection: true,
    selectOnFocus:true,
    allowBlank: false,
    value: 'Selecteer een type',
    listeners: [{
        select : function(field,nval,oval) {
            alert("Hit");
    }]
});

Answer 3

首先，FormPanel 上的侦听器不是必需的，因为 FormPanel 不会在其自己的事件上触发任何“选择”事件。您应该在 FormPanel 内的组件上添加侦听器，以侦听组件触发的指定事件。

对于你的情况，简单如下：

var typeIDcombo = new Ext.form.ComboBox({
    fieldLabel: 'Type',
    name: 'typeid',
    store: typeIdData,
    displayField:'name',
    valueField: 'typeid',
    hiddenName: 'typeid',
    typeAhead: false,
    mode: 'local',
    triggerAction: 'all',
    emptyText:'Selecteer het type link',
    forceSelection: true,
    selectOnFocus:true,
    allowBlank: false,
    value: 'Selecteer een type',
    listeners:{
         select:function(field, newVal, oldVal){
             if(newVal == 'HIDE_SOMETHING'){
                  Ext.getCmp('fieldId').hide();
                  Ext.getCmp('formId').doLayout();

             }
             else if(newVal == 'SHOW_SOMETHING'){
                  Ext.getCmp('fieldId').show();
                  Ext.getCmp('formId').doLayout();

             }
         }
    }
});