In extjs4 How to catch textarea's keypress event in controller - event-handling

Question

i am working in extjs. i have one textarea to enter word and one search button.I have view as-
Ext.define('Balaee.view.kp.Word.Word', {
extend : 'Ext.form.Panel',
id : 'WordId',
alias : 'widget.Word',
title : 'Dictionary',
height : 500,
items : [{
xtype : 'textfield',
fieldLabel : 'Enter the word',
name : 'wordtext',
//anchor:'100%',
allowBlank : false,
emptyText : 'Enter the word',
enableKeyEvents : true,
id : 'wordtext',
action : 'EnterAction'
},
{
xtype : 'button',
formBind : true,
fieldLabel : 'Search',
action : 'SearchAction',
text : 'Search'
}
]
});
And in controller i have function as-
SearchWord:function(button)
{
var j = Ext.getCmp('wordtext').getValue();
console.log("word is:"+j);
var answers = '{"data":[';
answers = answers + '{"word":"'+j+'"}'
answers =answers+']}';
console.log(answers);
var storeObject=this.getStore('kp.WordStore');
storeObject.load({
params:{
data: answers
},
callback: function(records,operation,success){
//console.log(records)
},
scope:this
});
var temp=Ext.getCmp('WordId');
temp.remove('WordInfoId');
var details=Ext.create('Balaee.view.kp.Word.WordInfo');
//details.region='center';
temp.add(details);
}
});
Now above function is working correctly when user is entering word in textarea and clicking on submit button. But i want to execute above "SearchWord" function of controller on enter button click also. i.e. If user will enter word in textarea and will press enter key then same function of controller needs to be executed.So how to catch textarea's enter key press event in controller?

Answer 1

Just listen for the specialKey event and call your function if the key is ENTER.
So in your controller's init function, do something like this:
this.control({
'#wordtext':{
specialkey: function(field, e){
if (e.getKey() == e.ENTER) {
//Do whatever you want here (such as call your SearchWord function)
}
}
}
});