View Full Version : Alternative way for Ext.getCmp

5 Dec 2012, 7:22 AM

I have lot of controls in ExtJS form which are placed inside different panels. Following is my code for one of the panel-

var pnlCIRT = new Ext.Panel({
region: 'south',
id: 'detailpanel',
collapsible: false,
autoScroll: true,
layout: 'vbox',
height: 300,
title: 'CIRT Details',
items: [{
xtype: 'fieldcontainer',
layout: 'hbox',
items: [{
xtype: 'displayfield',
id: 'dfdate',
name: 'date',
fieldLabel: 'Date',
labelWidth: 120,
value: date,
width: 143
}, {
xtype: 'splitter',
width: 200
}, {
xtype: 'displayfield',
id: 'dfcirtnumber',
name: 'cirtnumber',
fieldLabel: 'CIRT Number',
value: CIRTNumber,
labelWidth: 180,
width: 120

At this point; I'm using Ext.getCmp('dfcirtnumber').setValue(results.CIRTNumber); to read the control and set value.

I think; Ext.getCmp is NOT a good practice to read and set control values if there are huge amount of controls used within a form.

Please let me know if there is any way to get and set value of control using the panel name so that I can directly get control from the panel itself.

5 Dec 2012, 2:25 PM
If possible, always try to work relatively. For example if you need to update a form title on a button click, work relatively from the button:

onButtonclick: function(button) {
var form = button.up('myformXtype'),
field = form.down('textfield[name=someName]');


If you really need to work globally you can use Ext.ComponentQuery (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.ComponentQuery) which can also search for a component type with some specific attributes removing the need for globally unique id's

7 Dec 2012, 7:47 AM
If possible, always try to work relatively.

Wow, that's a hell of a lot better way to explain it than what I was always trying :)

+1 for the suggestion!

14 Dec 2012, 4:53 AM
Thanks for suggestions.