1

我正在尝试学习一些有关在表单中操作 UI 元素的知识。我有 2 个图形元素。我有一个包含任意事物列表的组合框，并且我有一个非常基本的表单面板。我想要做的是将组合框中单击项目的内容传递给表单上的输入框。单击组合框中的“猫”，然后表单将显示动物：猫...我一直在尝试添加侦听器并使用 .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 事件 mousedown 触发侦听器，但我似乎无法让它工作，如果事件/侦听器标签不正确，我深表歉意。

4

1 回答 1

2

因此，您需要为文本字段描述 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);
        }
    }
});
于 2013-07-09T15:43:02.947 回答