Ext JS – Disabling FormPanel submit if validation fails - regex

Question

I am not able to disable the button on form validation fails. I want to use regex: /^[0-9]+(,[0-9]+)*$/ for text area validation. I want to disable activatebutton.
I tried formBind and monitor validate still not working.
Here is the code:
items: [{
xtype: 'container',
layout: {
type: 'column'
},
items: [{
columnWidth: .75,
layout: "form",
monitorValid: true,
items: {
fieldLabel: 'Please Enter Activation Id',
name: 'Activate',
xtype: 'textarea',
msgTarget: 'under',
growMax: 200,
allowBlank: false,
blankText: "Please Enter Comma separated AssetIds",
regex: /^[0-9]+(,[0-9]+)*$/,
anchor: '100%'
}
}, {
columnWidth: .25,
items: {
xtype: 'button',
name: 'button',
id: 'activatebutton',
width: 100,
text: 'Set for auto-activation',
formBind: true,
listeners: {
click: function () {
shared.Notifier.success('The requ ');
this.seForActivation();
},
scope: this
}
}
}]
}]

Answer 1

In order for the formBind to work, you need to have an Ext.form.Panel.
The form panel will process the checks of the form fields and call the formBind when the whole form is valid.
The following code will propcess the formBind, see also the working Fiddle and the Ext.form.Panel documentation.
{
xtype: 'form',
layout: 'column',
items: [{
columnWidth: .75,
layout: "form",
monitorValid: true,
items: {
fieldLabel: 'Please Enter Activation Id',
name: 'Activate',
xtype: 'textarea',
msgTarget: 'under',
growMax: 200,
allowBlank: false,
blankText: "Please Enter Comma separated AssetIds",
regex: /^[0-9]+(,[0-9]+)*$/,
anchor: '100%'
}
}, {
columnWidth: .25,
items: {
xtype: 'button',
name: 'button',
id: 'activatebutton',
width: 100,
text: 'Set for auto-activation',
formBind: true,
listeners: {
click: function () {
shared.Notifier.success('The requ ');
this.seForActivation();
},
scope: this
}
}
}]