Tuesday, March 31, 2009

Ext JS - Disabling FormPanel submit if validation fails

To disable the FormPanel's submit button if the validation fails (example like allowBlank:false). You will need to set the FormPanel's monitorValid to true and the submit button's formBind to true.

[sourcecode language='jscript']
var form=new Ext.form.FormPanel{
monitorValid:true,
items:[{
name:"testing",
xtype:'textfield',
fieldLabel:'Test',
allowBlank:false, //Must be filled in
value:'' //Set the value so that the validation will trigger
}],
buttons:[{
text:'Submit',
formBind:true //If validation fails disable the button
}
]
}
[/sourcecode]

In some cases you might need to set the value of the textfield or combobox explicitly to empty string. If not the validation will not kick in.
Links

Login Form: Disable 'submit' until username has been input

No comments:

Post a Comment