Rule based & asynchronous validation in Flex forms

Sometimes in Flex, you’ll need to perform asynchronous form validation. where rather than simply checking that a string matches certina criteria, you’ll need to take a trip to the server — Eg., checking to see if a username is already used during signup.

In scenario’s like this, the out-of-the-box validation framework just doesn’t cut it. I’ve tried shoe-horning the standard Validator class to block validation, and it’s just not pretty.

However, I remain a fan of declarative form validation. It’s possible to write screeds of validation code in Presentation Model / Mediator classes, but I still prefer a simple bit of markup that describes the validation being applied.

To address this, I’ve put together a very small validation framework that handles asyncronous validation, amongst others. Instead of decalring Validators in your view, instead decalre a ValidationCollection with a bunch of ValidationRules. Here’s an example:

 <mx:Button label="Register" enabled="{ validationRules.isValid }" /> <validation:ValidationRuleCollection id="validationRules"> <validation:UsernameIsUniqueValidationRule username="{ txtUsername.text }" targetComponent="{ txtUsername }" /> <validation:EmailIsUniqueValidationRule email="{ txtEmailAddress.text }" targetComponent="{ txtEmailAddress }" /> <validation:PasswordsMustMatchValidationRule password1="{ txtPassword.text }" password2="{ txtPasswordConfirm.text }" targetComponent="{ txtPasswordConfirm }" /> <mx:StringValidator required="true" source="{ txtUsername }" property="text" requiredFieldError="{ ResourceManager.getInstance().getString( ResourceBundles.ERROR_MESSAGES , 'REQUIRED_FIELD_ERROR' )}" /> </validation:ValidationRuleCollection> 

The ValidationCollection serves to aggregate the results of all it’s enclosing validation rules, and give a single point useful for databinding. In the above example, the Register button is not enabled unless all the validation rules have passed.

Declared inside are a series of discreet validation rules. The interface here is a lot less prescriptive than using the Validator base class, and it’s possible to write rules as simple or as complex as required.

Eg., in the above example there’s asyncronous checks to see if username & email are both available. In another case, there’s a rule which compares the text values of two passwords to make sure they match.

Also note that you can mix and match validation rules and Validator subclasses (such as the StringValidator above). This prevents you from having to re-invent the wheel by utilising all the validators that come out-of-the-box with Flex.

Under the covers, Validator instances are decorated to instances of IValidationRule to get things working.

Source code is available here, (or as a zip file here) along with some sample validation rules… should you find it useful.

Update:

Wow, this is the most popular blog on my whole site.  I’ve fixed the broken link, and have ported the code across to GitHub.  Please feel free to fork and contribute!

Advertisements

13 thoughts on “Rule based & asynchronous validation in Flex forms

  1. Gary Benade says:

    awesome! thanks for sharing

  2. Chris says:

    The link for the source doesnt seem to be working. Where can I get this code?

  3. Sean says:

    Thanks! This seems very on-point with what I am trying to do in my current project.

    I’d love to get a look at the source file, but I can’t get the link to work either.

    Thanks,

    Sean

  4. Sean says:

    Never mind, I got the link to work this morning.

    Thanks!!!

  5. Holyfox says:

    Hi,

    i want it too !!! It seems to be exactly what i nedd !!
    Thanks !

    • Marty Pitt says:

      Hi

      I’ve emailed it to you. I’ll migrate it to google code after the xmas break, I’m in rural NZ at the moment, and have dodgy internets!

      If the code doesn’t turn up, drop me a line at martypitt at me dot com.

  6. Ajar says:

    This looks awsesome. However the zip link does not work. Please see if you can send it to me too.

  7. deshartman says:

    Can you share the code on Github instead. It’s free and I don’t have to sign up for the stupid file factory which is just a scam anyway.

    http://www.github.com

  8. Antony says:

    Hi there, this seems to be exactly what im looking for, just a few questions if you dont mind, I seem to be missing some packages to get the example working…

    com.inversion.common.ResourceBundles (I assume i can just substitute this with my own string? )

    and also

    com.inversion.common.error.AbstractMethodError ,

    needed by AbstractValidationRule, throw new AbstractMethodError(); is there a workaround for this, or knowing me im completley missing the point and its quite simple…. 🙂

    Thanks for your time 🙂

  9. Gaylord bonzodog says:

    I think this looks great too! Where can I get it?

    g.

  10. PRB says:

    Marty, link still seems down. Can you email me the source as well? I’d love to implement this in my app.

    Thanks
    -pb

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: