View Full Version : disbale button based on condition

17 Nov 2011, 9:00 PM
Hi all,
I am trying to disbale button based on some condition. I tried following thing

var simplePanel = new Ext.form.FormPanel({
standardSubmit: true,
width: 350,
defaults: {width: 230},
items: [ {
handler : function(b, e) {
disabled : function(button) {
//Some condition.
// return true or false
scope: this,
text: 'Button1',
width: 70,
xtype: 'button'

In above case my button always remains disabled irrespective of function disabled returns true or false.
I dont was to set the button externally(form some other location).
I know that there is no support disabled : function mentioned in documentation. but just tried.

Is there any way by which this can be achieved ?

18 Nov 2011, 2:26 AM
As you have noted, the disabled config option cannot be a function, it is a boolean. The setDisabled method needs to be called when you want to change the disabled status of the button. You would typically do this in an event listener for whatever event causes the disabled status to change. There is also the monitorValid property of a FormPanel, which coupled with formBind: true on the buttons means this event listener and calling of setDisabled happens 'by magic' within Ext.