PDA

View Full Version : Event click on BoxComponent



aperez
5 Aug 2010, 8:11 AM
Hi,

I want trigger a function when i click on the image, but the BoxComponent has no event 'click', how can put a event 'click' inside BoxComponent?

All my Code:

Ext.onReady(function(){
Ext.BLANK_IMAGE_URL = '$VERSION_EXTJS$/resources/images/default/s.gif';
var img1 = new Ext.BoxComponent({
autoEl:{
tag: 'img'
,src: '/ima/apl_sopor/an_clte.gif'
}
,style: 'border:1px solid #ff0000'
,margins: '2 2 2 2'
});
var img2 = new Ext.BoxComponent({
autoEl:{
tag: 'img'
,src: '/ima/apl_sopor/ped_ent.gif'
}
,style: 'border:1px solid #ff0000'
,margins: '2 2 2 2'
});
var img3 = new Ext.BoxComponent({
autoEl:{
tag: 'img'
,src: '/ima/apl_sopor/facturacion_clientes.gif'
}
,style: 'border:1px solid #ff0000'
,margins: '2 2 2 2'
});
var p1 = new Ext.Panel ({
html: 'Panel 1'
});
var p2 = new Ext.Panel ({
html: 'Panel 2'
});

var v1 = new Ext.Viewport({
renderTo: Ext.getBody()
,layout: 'border'
,items: [{
region: 'north'
,xtype: 'panel'
,html: 'Panel North'
},{
region: 'west'
,width: 90
,split: true
,items: [img1,img2,img3]
,layout: 'vbox'
},{
region: 'center'
,xtype: 'panel'
,html: 'Panel Center'
},{
region: 'east'
,width: 200
,split: true
,items: [p1,p2]
,layout: 'vbox'
,layoutConfig:{
align: 'stretch'
}
},{
region: 'south'
,xtype: 'panel'
,html: 'Panel South'
}]
});



}); //end onReady


A possible solution:


var fnTest = function (){
alert('text');
}

var element = img1.getEl();
element.on('click', fnTest.createDelegate(this));

But, this solution only work when the object is render and i want write the code of 'click' event inside the BoxComponent, It's possible?

Thank's.