PDA

View Full Version : Using getComponent to refer a ext element



nikhilkrishnan
14 Sep 2011, 1:56 AM
I have a window and a form in that window. And using the 'show' event i can refer the form like this


listeners:{
'show':function(obj){
var form=obj.getComponent('pdt_form').getForm();

}
},

This is working. But I need to access a child component of the form say the 'combo' but when i do

form.getComponent('category_id')
it returns undefined.

The code for form and window is

var product_window= Ext.create('Ext.Window',{
itemId:'product_window',
width:650,
height:220,
title:'Product',
layout:'fit',
modal:true,
items:[{
xtype:'form',
itemId:'pdt_form',
defaults:{
border:false
},
bodyStyle:'background-color:#DFE8F6;',
layout:'column',
items:[{
bodyStyle:'padding:5px;background-color:#DFE8F6;',
columnWidth:0.5,
layout:'anchor',
defaults:{
anchor:'100%'
},
items:[{
xtype:'hidden',
name:'product_id'
},{
xtype:'textfield',
fieldLabel:'Product',
allowBlank:false,
name:'product'
},{
xtype:'combo',
editable:false,
allowBlank:false,
fieldLabel:'Category',
itemId:'category_id',
name:'category_id',
store:Ext.create('Ext.data.Store',{
itemId:'category_store',
fields:['category_id','category'],
proxy:{
url:BASE_URL+'category/combo',
type:'ajax',
reader:{
type:'json',
root:'data'
}
},
autoLoad:true,
listeners:{
'load':function(obj){
}
}
}),
displayField:'category',
valueField:'category_id'
}.....
Please help...

mitchellsimoens
14 Sep 2011, 5:04 AM
ComponentQuery to the rescue!

To get a Component by it's XType, do this:


win.down('form')

This will return the first direct child of 'win' that has an XType of 'form'.


win.query('combobox')

This will return all children of 'win' that has an XType of 'combobox'. Unlike down, this will traverse the entire child structure so it doesn't matter how far down the stack it is.