Agregar Haga clic en Panel de Evento con ExtJS

Question

Estoy tratando de crear en el panel js ext y consiguió el éxito en eso, pero también quiero añadir evento click con esta

 { 
      xtype: 'panel', 
      flex: 1, 
      x: 10, 
      y: parseInt(panelCreation[i - 1].y) + 
       parseInt(panelCreation[i -1].height) + 10, 
      width: twidth, 
      height: theight, 
      layout: 'absolute'     
     } 

no quiero añadir evento click separado Deseo agregar con este código como después del diseño: coma y evento de suma absoluta por favor ayúdenme en esto.

Answer 1

Usted puede agregar en el siguiente para un evento de clic:

listeners: { 
    'render': function(panel) { 
     panel.body.on('click', function() { 
      alert('onclick'); 
     }); 
    } 
} 

EDIT: para obtener la coordenadas X e Y del evento click se puede cambiar el controlador de eventos Click de la siguiente manera ...

panel.body.on('click', function(e) { 
    alert('X: ' + e.getPageX()); 
    alert('Y: ' + e.getPageY()); 
}); 

Answer 2

new Ext.Panel({ 
    title: 'The Clickable Panel', 
    listeners: { 
     render: function(p) { 
      // Append the Panel to the click handler's argument list. 
      p.getEl().on('click', handlePanelClick.createDelegate(null, [p], true)); 
     }, 
     single: true // Remove the listener after first invocation 
    } 
}); 

Answer 3

No lo es, en mi opinión, una forma mucho más sencilla de hacer esto ... (tomado directamente de la docs). Para obtener más información sobre cómo agregar un oyente, vea here. (Ext JS 4)

new Ext.panel.Panel({ 
    width: 400, 
    height: 200, 
    dockedItems: [{ 
     xtype: 'toolbar' 
    }], 
    listeners: { 
     click: { 
      element: 'el', //bind to the underlying el property on the panel 
      fn: function(){ console.log('click el'); } 
     }, 
     dblclick: { 
      element: 'body', //bind to the underlying body property on the panel 
      fn: function(){ console.log('dblclick body'); } 
     } 
    } 
});