CODEWITHSUNDEEP
extjsextjs4.2
webCoder
webCoder

Reputation: 2232

how to add click event to inner element of Xtemplate extjs 4.2?

I want to add click event to inner element of Xtemplate, below is my code. Thanks in advance.

var ruleTemplate = new Ext.XTemplate(
        '<tpl for=".">',
            '<div class="rule-item" id={key}>',
                '{key}',
                '<tpl if="value == \'true\'">',
                '<i class="add">&nbsp;</i>',
                '<tpl else>',
                '<i class="group">&nbsp;</i>',
                '</tpl>',
            '</div>',
        '</tpl>'
);


var ruleView =  Ext.create('Ext.view.View', {
    store: rulesStore,
    tpl:ruleTemplate,
    region: "center",
    itemSelector: 'div.rule-item',
    border: true,
    listeners: {
        itemclick: function(view, record, item, index, e, eOpts) {

        }
    }
});

I tried hasCls and some other way to call two different function on click of add and group class but no luck.

please help.

Upvotes: 3

Views: 3403

Answers (1)

CD..
CD..

Reputation: 74176

Your approach should work fine:

itemclick: function(view, record, item, index, e, eOpts) {
    clickedEl = Ext.get(e.target);

    console.log(clickedEl.hasCls('add'));
}

Example: https://fiddle.sencha.com/#fiddle/h4o

Upvotes: 4

Related Questions