How to catch event of hyperlink in controller in extjs4? - hyperlink

Question

I am working in extjs4 MVC.I am getting stuck at a point where I have to catch event click of hyperlink in extjs4.I want to catch that event in controllers 'control' method.I tried a lot but not get solved please some one give some suggestion to how to solve this problem.
1)Here is my some view code :--
Ext.define('AM.view.user.linkView', {
extend:'Ext.form.Panel',
alias:'widget.Link',
title:'hyper link',
items:[
{
xtype: 'box',
autoEl: {tag: 'a', href: '#', html: 'Click on this button',id:'link'}
}]
});// End of login class
2)Here is my controller code: ---
Ext.define('AM.controller.Users', {
extend: 'Ext.app.Controller',
views: ['user.linkView'],
init: function() {
this.control({
'Link box[tag: a]':
click:this.linkClicked
});
},
linkClicked:function()
{
console.log("clicked on link");
}
});
I tried a lot on it.but not get solved this problem.How can I solve this this please give some suggestion...

Answer 1

Ext.define('AM.view.user.linkView', {
extend:'Ext.form.Panel',
alias:'widget.Link',
name:'linkPanel',
title:'hyper link',
items:[
{
xtype: 'box',
autoEl: {tag: 'a', href: '#', html: 'Click on this button',id:'link'}
}]
});// End of login class
Use below code in controller
var controller = this;
controller.control({
'linkPanel': {
afterrender: function() {
Ext.get('link').on('click', function() {
controller.linkClicked();
});
}
}
});
This will work !!!!
Thanks