PDA

View Full Version : [4.2] Custom Component fire event when click in a tpl link



rafaelrp
24 Feb 2015, 6:51 AM
Hello!

I have a custom component with a link into a html tpl, i need when i click in this link the component fire an event to i listen in the controller.

code:


...
tpl: [
'<div class="title center"><p>{title}</p></div>',
'<div class="content center">',
'<div class="number center"><h1>{qtd}</h1></div>',
'<div class="ind left">',
'{ind}',
'</div>',
'</div>',
'<div class="more">',
'<a href="#" class="clickme">See all...</a>',
'</div>'
],
...


I've tryed to create listener with delegation but i cant get the component scope into the listener.


..
listeners: {
// Add the listener to the component's main el
el: {
delegate: '.clickme',


click: function(ev, li) {
// need to fire event in component here
}
}
},
...


the event needs to be fired in the "clickme" class.

rafaelrp
25 Feb 2015, 6:01 AM
The solution:
cmp.el.on('click', function(event, target) { cmp.fireEvent('openRel', cmp);}, null, {delegate: 'a'});Needs to get the DOM of the component and then delegate a click event to the tag.

skirtle
25 Feb 2015, 3:32 PM
For reference, you may find the section on events useful:

http://skirtlesden.com/articles/html-and-extjs-components

rafaelrp
26 Feb 2015, 3:51 AM
I have relied in your tutorial to built my plugin, it great for reference.Thanks :)