How to listen for dom events in ExtJS

Question

I've to use html sometimes in ExtJS code, but how to listen for dom events in extjs? I know i can listen them but in this way i have to use global functions. Here is what i've done already:

<a title="click on me" href="javascript:abc();">' + value+ '</a>

Answer 1

Instead of firing event from tag, attach event this way:

var domElement = document.getElementsByTagName("a");
domElement.on('click', function(event, element, options) {
});

Answer 2

Not every ExtJS component raises every event. However, by targeting the container’s element, you can attach many native events to which the component can then listen. You must target the underlying element you want to listen and attach a click listener. The config should look something like this:

listeners: {
    click: {
        element: 'el', //bind to the underlying el property on the panel
        fn: function() {
            console.log('Element was clicked!');
        }
    }
}

http://docs.sencha.com/extjs/4.2.5/#!/api/Ext.util.Observable-cfg-listeners