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.

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
      }
    ]
}

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

---

Possibly related posts: (automatically generated)

• Form validation and form behavior