Extjs - Multiple delegations for click event

How to do this in order to have several delegations? Below is the code I tried, but it did not finish the job.

listeners: { el: [{ delegate: '.my-boundlist-item-menu', click: function(cmp) { console.log('1'); } },{ delegate: '.my-boundlist-item-menu-2', click: function(cmp) { console.log('2'); } }] } 

I also tried the following without success:

 listeners: { itemclick: function(record, item, index, e, eOpts){ if (eOpts.getTarget('.my-boundlist-item-menu')) { console.log('1'); } else if (eOpts.getTarget('.my-boundlist-item-menu-2')) { console.log('2'); } else { console.log('3'); } } } 

But none of the methods worked. Thoughts and / or help on how to make it function properly?

EDIT: As already mentioned, here is my code with a list:

 { xtype: 'combobox', displayTpl: Ext.create('Ext.XTemplate', '<tpl for=".">', '<tpl if="FirstName">', '{FirstName}', '</tpl>', ' ', '<tpl if="LastName">', '{LastName}', '</tpl>', '</tpl>'), x: 10, y: 60, listConfig: { tpl: '<div class="my-boundlist-item-menu" style="cursor:pointer;padding:2px;border:1px dotted #fff" onmouseover="this.className=\'my-boundlist-item-menu x-boundlist-item-over\'" onmouseout="this.className=\'my-boundlist-item-menu\'" >Add New Contact</div>'+'<div class="my-boundlist-item-menu-2" style="cursor:pointer;padding:2px;border:1px dotted #fff" onmouseover="this.className=\'my-boundlist-item-menu x-boundlist-item-over\'" onmouseout="this.className=\'my-boundlist-item-menu\'" >Use Myself</div>'+'<tpl for=".">'+'<div class="x-boundlist-item">'+'<tpl if="FirstName">{FirstName} </tpl>'+'<tpl if="LastName">{LastName}</tpl>'+'</div></tpl>', listeners: { el: [ { delegate: '.my-boundlist-item-menu', click: function(cmp) { console.log('1'); } }, { delegate: '.my-boundlist-item-menu-2', click: function(cmp) { console.log('2'); } } ] } }, id: 'end-contact', fieldLabel: 'Location Contact', labelWidth: 125, name: 'idContact', displayField: 'FirstName', store: 'ContactStore', valueField: 'idContact', listeners: { expand: { fn: me.onexpandend, scope: me } } }, 
+4
source share
1 answer
 el: { delegate: '.my-boundlist-item-menu', click: function(cmp, a) { console.log('clicked', cmp, a); } } 

a will contain the div to be pressed.

Check documentation for click event - http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.dom.Element-event-click

The second argument will target the HTML target.

+3
source

Source: https://habr.com/ru/post/1486931/


All Articles