title: How can i handle mouseclicks of items inside a dataview
body: <p>each item in my dataview has a text and a div which represents a button. The button is only shown when the mouse is over the item. How can i handle a mouseclick on the button-div?<br><br>
  What i have so far is this:</p>
  
  <pre><code>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',
      '&lt;tpl for="."&gt;',
          '&lt;div class="logentry"&gt;',
              '&lt;span&gt;{text}&lt;/span&gt;',
              '&lt;div class="removeicon"&gt;&lt;/div&gt;',
          '&lt;/div&gt;',
      '&lt;/tpl&gt;'
  ),
  
  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);
      }
  }
  </code></pre>
  
  <p>Working example: <a href="http://jsfiddle.net/suamikim/3ZNTA/" rel="nofollow">http://jsfiddle.net/suamikim/3ZNTA/</a></p>
  
  <p>The problem is that i can't distinguish in the itemclick-handler if the button-div or the text-span has been clicked.<br><br>
  Thanks &amp; best regards,
  Mik</p>