Ext JS Search button which is attached to form

Question

So basically I wanted to make a thing like this. A search button which is disabled. than when somebody enters something in one of the fields of the form I want button to enable itself and if somebody cleans every input up than I want to disable that button back. So my Idea was something like this. Extend the button provided by Ext JS. and somehow when this button is drawn or initialized, attach event of value changed to its upper form's input fields. so basically when somebody changes value of any input, that method attached as a listener will be called and than with help of some logic I can achieve the thing I want. but there is one problem. I don't really see how to do that. I mean I have some guesses but all of them have led me to the dead-end. So can you suggest what can I look at or from where to start ?

Answer 1

You can use formBind to enable/disable button depending on the validity state of the form. Validity of the form fields are checked against the validators set for form fields (like allowBlank: false). See the Example usage here

Another way to validate is to use VTypes

But, for the specific requirement to enable button if user enter values in any one of the fields, you might require custom validators. Sample fiddle here: https://fiddle.sencha.com/#fiddle/5qe