用于newb到js/extJS的extJS事件/侦听器

用于newb到js/extJS的extJS事件/侦听器,extjs,event-listener,Extjs,Event Listener,我试图学习一点关于在表单中操作UI元素的知识。我有两个图形元素。我有一个组合框,其中包含任意内容的列表,还有一个非常基本的表单面板。 我试图做的是将combobox中单击项的内容传递给表单上的输入框。 点击组合框中的“猫”,表格会显示animal:cat…我一直在尝试添加侦听器并使用.on方法来完成此操作,但我似乎无法获得它。任何建议或提示都将不胜感激 Ext.onReady(function () { // The data store containing the list of cool

我试图学习一点关于在表单中操作UI元素的知识。我有两个图形元素。我有一个组合框,其中包含任意内容的列表,还有一个非常基本的表单面板。 我试图做的是将combobox中单击项的内容传递给表单上的输入框。 点击组合框中的“猫”,表格会显示animal:cat…我一直在尝试添加侦听器并使用.on方法来完成此操作,但我似乎无法获得它。任何建议或提示都将不胜感激

 Ext.onReady(function () {
// The data store containing the list of cool stuffz
var animals = Ext.create('Ext.data.Store', {
    fields: ['id', 'name'],
    data: [{
        "id": 'cat',
        "name": "mycat"
    }, {
         'id' : 'dog',  
        "name": "mydog"
    }, {
        'id' : 'sbBarGirls', 
        "name": "heartbreaking-man-eating-deathclaw"
    }
    //...
    ]
});

// Create the combo box, attached to the states data store
Ext.create('Ext.form.ComboBox', {
id: 'combo',
width: 600,
    fieldLabel: 'Choose animal',
emptyText: 'dont select the last one',
store: animals,
    queryMode: 'local',
    displayField: 'name',
    valueField: 'id',
    renderTo: Ext.getBody()
});
});
//此处为非相关代码

 Ext.onReady(function(){

Ext.create('Ext.form.Panel', {
    title: 'Animal sanctuary, one animal per location  ',
    width: 300,
    bodyPadding: 10,

    style: 'background-color: #Fdd;',
    renderTo: Ext.getBody(),
        items: [{
    xtype: 'textfield',
    fieldLabel: 'animal:',
    name: 'myanimal'
    }]

});
});

我试图在其中一个组合选项上使用dom event mousedown来触发侦听器,但我似乎无法使其工作,如果event/listener标记不正确,我深表歉意。

因此您需要描述文本字段的id,例如:

{
    id: 'wild_but_very_good_animal',
    xtype: 'textfield',
    fieldLabel: 'animal:',
    name: 'myanimal'
}
并为组合添加侦听器:

Ext.create('Ext.form.ComboBox', {
    id: 'combo',
    width: 600,
    fieldLabel: 'Choose animal',
    emptyText: 'dont select the last one',
    store: animals,
    queryMode: 'local',
    displayField: 'name',
    valueField: 'id',
    renderTo: Ext.getBody(),
    listeners: {
        'change': function(field, selectedValue) {
            Ext.getCmp('wild_but_very_good_animal').setValue(selectedValue);
        }
    }
});