View Full Version : How to mark a field as invalid after asynchronous validation

Keith Chadwick
3 Jul 2010, 5:32 AM
I was in the process of writing this post as a 'please help before I lose it' request when I suddenly realized the solution. Since it took some time for me to realize the solution even after scouring the forum I though perhaps it would be a good idea to post the solution up as it seems to me to be a common type of validation.

You have a form with clientvalidation turned on. This validation event ensures that your form buttons remains disabled until all the form fields pass validation. Within your form you have a vtype email textbox that you need to check on a change event server side to ensure it is unique and if not set the control as invalid.

In order to do this you need to add a custom property to the object within the config that you can then check against with a validator function. Your async request on the change event needs to set this value accordingly. Therefore your code could be the following:

emailIsUnique:true, //custom property
// do your ajax request that returns true or false on the email being unique
validator:function(){ return this.emailIsUnique)

Seems simple enough except if you are like me and you scour the API docs and objects in Firebug looking for that elusive function to come to your rescue. Like anything else the solution is simple once you have done it once!


3 Jul 2010, 6:04 AM
Have you seen the RemoteValidator plugin (http://www.sencha.com/forum/showthread.php?19112-New-Remote-Field-Validation-Plugin) (it originally was for Ext 2.x, so it might need some tweaks to make it compatible with the latest Ext version)?

Keith Chadwick
3 Jul 2010, 7:02 AM
No I have not. I will have a peek under the hood at it and try it in 3. If it needs some work I will try to update and post up any changes.