Enable button when started writing in TextArea using EXT JS - extjs

Question

I have requirement to enable a button , lets say Submit button , when user will start writing in TextArea using EXT JS.
At start, as TextArea is empty , Submit Button is disabled. As soo as user starts writing in TextArea , it should get enabled .
Please tell me if there is any event which tracks writing in TextArea in EXT JS

Answer 1

Something like this should do -
{
xtype : 'textareafield',
grow : true,
name : 'MyTextField',
fieldLabel: 'MyTextField',
listeners : {
blur: function(event, eOpts){
// here you can get reference to the button and enable
},
change: function(newValue, oldValue, eOpts) {
// this event will be fired whenever the value of the text field changes when you type.
// You can even listen to this function and enable the button when this event fires
}
}
}
To get a list of the events that you can listen to, I suggest you check the API doc. Here's the TextArea api doc for Ext 5.0

Answer 2

Use: formBind: true will be enabled/disabled depending on the validity state of the form.
Ext.create('Ext.form.FormPanel', {
title : 'Sample TextArea',
width : 400,
bodyPadding: 10,
renderTo : Ext.getBody(),
items: [{
xtype : 'textareafield',
grow : true,
allowBlank: false,
name : 'message',
fieldLabel: 'Message',
anchor : '100%'
},{
xtype: 'button',
text: 'My Button',
formBind: true,
disabled: true
}]
});