私のデータビューの各アイテムには、ボタンを表すテキストと div があります。ボタンは、マウスが項目の上にある場合にのみ表示されます。ボタン div でマウスクリックを処理するにはどうすればよいですか?
私がこれまでに持っているのはこれです:
xtype: 'dataview',
store: Ext.create('Ext.data.Store', {
model: 'LogEntry',
data: [
{ text: 'item 1' },
{ text: 'item 2' },
{ text: 'item 3' },
{ text: 'item 4' },
{ text: 'item 5' }
]
}),
tpl: Ext.create('Ext.XTemplate',
'<tpl for=".">',
'<div class="logentry">',
'<span>{text}</span>',
'<div class="removeicon"></div>',
'</div>',
'</tpl>'
),
itemSelector: 'div.logentry',
trackOver: true,
overItemCls: 'logentry-hover',
listeners: {
'itemclick': function(view, record, item, idx, event, opts) {
// How can i distinguish here if the delete-div has been clicked or some other part of the dataview-entry?
console.warn('This item respresents the whole row:', item);
}
}
作業例: http://jsfiddle.net/suamikim/3ZNTA/
問題は、ボタン div またはテキスト スパンがクリックされたかどうかを itemclick-handler で区別できないことです。
ありがとう、よろしく、 ミク