Validating fields in a Sencha Touch app

Question

I am looking a solution similar to the formBindproperty in Ext.js but in ST2.4, validating my form, for example with a red underline in the specified field with an error.

How to do this?

Thank you in advance.

Answer 1

The property in ExtJS that determines if a textfield should be displayed with a red underline if invalid is allowBlank.

The equivalent property in SenchaTouch is required. The default behaviour is to place an asterisk next to the field label (no red line css is provided).

In SenchaTouch there is no form validation like in ExtJS. Therefore the formBind property you bind to buttons and the like in ExtJS to have them set to enabled/disabled does not exist.

The only thing I can think of is to extend the basic form panel and provide your own validation logic. I've implemented this in the following Fiddle. As long as you set any of your textfield items to have a required property that is true then the validation logic will kick in. Likewise the custom panel can be used without validation if none of the textfield items have the required property set.

You could also update the validateFields function I provided to update css classes if you want a visual indication that your form fields are invalid.

Hope this helps.