Mike Thomsen
Mike Thomsen

Reputation: 37526

How do you attach click events to ExtJS template elements?

How would I add a click event to each link tag in this other than by building in onclick=.... into the XTemplate?

new Ext.XTemplate(
    '<ul>',
    '<tpl for="."><li><a href="#{anchor}">{text}</a></li></tpl>',
    '</ul>'
).overwrite('someElement', [
    { text: 'Click me', anchor: '1' },
    { text: 'No, click me', anchor: '2'}
]);

Upvotes: 5

Views: 9799

Answers (1)

Evan Trimboli
Evan Trimboli

Reputation: 30092

The short answer is, you don't. Instead, you should use event delegation:

Ext.get('someElement').on('click', function(event, target) {
    console.log(target);
}, null, {delegate: 'a'});

This has 2 main advantages:

  1. You only need to bind a single listener
  2. It will work as you dynamically modify the content

Upvotes: 7

Related Questions