ExtJS - How to get the value of a component element

Question

I have the following component:

{ xtype: 'fieldcontainer', layout: 'hbox', id: 'article-level-container', defaultType: 'textfield', fieldDefaults: { labelAlign: 'top' }, items: [{ fieldLabel: 'LEVEL', name: 'artLevel', inputWidth: 216, margins: '0 5 5 0', allowBlank: false, fieldStyle: 'text-align: right; font-size: 13pt; background-color: #EAFFCC;' }, { fieldLabel: 'VALUE', name: 'artValue', inputWidth: 216, allowBlank: false, blankText: 'zorunlu alan, boş bırakılamaz', fieldStyle: 'text-align: right; font-size: 13pt; background-color: #EAFFCC;', listeners: { change: function(textfield, newValue, oldValue) { if (oldValue == 'undefined' || newValue == '') { Ext.getCmp('btnArticleSave').disable(); } else { Ext.getCmp('btnArticleSave').enable(); } } } }] } 

I want to get the value of the second fieldLabel element (in this case VALUE).

• How to get this field value outside the onReady function?
• How can I change this field label with a new value (I want to change the field label with the selected combo box value)

UPDATE I tried the following:

 var artField = Ext.ComponentQuery.query('#articleValueField'); console.log(artField); 

Answer 1

A few ways, but usually use Ext.ComponentQuery :

Indicate your itemId field in its configuration, for example. itemId: 'theField' :

  var field= Ext.ComponentQuery.query('#theField')[0]; field.setFieldLabel(valueFromCombo); 

Add change to your combo element, you can use up and down (which are also compound queries)

 listeners: { change: function(combo) { var form = combo.up('#form'); var field = form.down('#theField'); field.setFieldLabel(lookupValueFromCombo); } } 

Remember that any configuration settings in ext js will get setter and getter, so fieldLabel has getFieldLabel() and setFieldLabel(s) methods.

change above only with ext js 4.1+ with ext js 4.0+ you can do:

 field.labelEl.update('New Label'); 

Answer 2

to get the selected combobox element outside the combo listener

 yourComboboxName.on('change', function (combo, record, index) { alert(record); // to get the selected item console.log(record); // to get the selected item });