PDA

View Full Version : Why is not there a 'tap' event on Panel ?



Dragnalith
14 Aug 2011, 8:13 AM
I have just noticed there is not any 'tap' or 'click' event on Panel, and in general in Component. I don't understand why because it's useful to know when a user touch a component.
I my case I make a pop I want to discard if user tap anywhere, and I don't find an easy way to do it.

mitchellsimoens
15 Aug 2011, 9:03 AM
panel.mon(panel.el, {
tap : function(e, t) {...}
});

You have to add it after the Panel has been added as you need the EL of the Panel.

Dragnalith
15 Aug 2011, 11:49 AM
Thanks, I had found it by my side. But I don't understand why you have made that choice.

mitchellsimoens
15 Aug 2011, 12:09 PM
Thanks, I had found it by my side. But I don't understand why you have made that choice.

What do you mean?

Dragnalith
15 Aug 2011, 12:14 PM
I confuse event and listeners sorry. I don't understand why there is not 'tap' listeners in Panel.

mitchellsimoens
15 Aug 2011, 12:19 PM
I confuse event and listeners sorry. I don't understand why there is not 'tap' listeners in Panel.

Because it's on Element so you don't need it on Panel.

krislogy
16 Nov 2011, 5:20 AM
Hello, about the solution: panel.mon(panel.el, { ... });

Well, I was trying to find that function "panel.mon" and "panel.el" .. in the documentation.
http://docs.sencha.com/touch/1-1/#!/api/Ext.Panel

But couldn't. Do you know why it is not given in the docs.. or is it given somewhere else that I should be looking for.

Thanks!!
Kris

AndreaCammarata
16 Nov 2011, 10:26 AM
I have just noticed there is not any 'tap' or 'click' event on Panel, and in general in Component. I don't understand why because it's useful to know when a user touch a component.
I my case I make a pop I want to discard if user tap anywhere, and I don't find an easy way to do it.

You can achieve that by using event delegation.



var pnl = new Ext.Panel({
fullscreen: true,
listeners: {
body: {
tap: onPanelTap
}
}
});


where onPanelTap is your handler function.

Hope this helps.

RonnyT
26 Nov 2011, 6:27 AM
As it says in the documentation on Ext.util.Observable, specify the element to attach the listener to.


new Ext.Panel({
width: 400,
height: 200,
dockedItems: [{
xtype: 'toolbar'
}],
listeners: {
click: {
element: 'el', //bind to the underlying el property on the panel
fn: function(){ console.log('click el'); }
},
dblclick: {
element: 'body', //bind to the underlying body property on the panel
fn: function(){ console.log('dblclick body'); }
}
}
});

mukeshgla
9 May 2012, 10:46 PM
Hi,

I have a requirement when I click on a panel area I need to change the color of this area and some data is to be manipulated , but there is no tap or click listener for Ext.Panel, How can I achieve this functionality. here is my code, can any one let me know where do need to make change ?

Ext.define('Amap.view.Investment', {
extend: 'Ext.Panel',
xtype: 'investment',

config: {
items : [{html: 'here goes my investment'}]
}
});

I made the changes suggested by AndreaCammarata (http://www.sencha.com/forum/member.php?77762-AndreaCammarata) but it did not work