I have to say that I love the Adobe Spry Javascript framework. It is easy to use and simply just works. For most situations it comes with “widgets” for just about everything you need in your Ajax enabled web application.

One of my favorite widgets is the Text Validation one. With it you are able to validate just about everything the user enters and you will have full control of the input, even the pattern of the input.

But what about if you need a custom validation? According to the documentation you can use the “custom” parameter with a “pattern”. But if you use it, you actually apply a “pattern”, meaning applying a pattern of “pattern: “bbb” only allows the user to enter 3 alphabetical characters, but nothing more. Usually you want to have the user enter only alphabetical characters and not limiting the amount of chars.

In order to achieve this, you have the undocumented parameter called “characterMasking”! “characterMasking” combined with “usecharacterMasking: true” allows you to pass Regular Expressions to the text field you want to validate within the Spry syntax. Powerful stuff. It is beyond me, why Adobe has not updated their documentation on this. In any case, here is a example:

Say you want to allow only alphabetical character in lowercase and nothing else, you would use a syntax of;

var custom = new Spry.Widget.ValidationTextField(“myfield”,”custom”, {isRequired:true, hint:’some hint’, characterMasking: /[a-z]/, useCharacterMasking:true, validateOn:["blur", "change"]});

Would you like to only enable digits and spaces?

var sd = new Spry.Widget.ValidationTextField(“subdomain”,”custom”, {isRequired:true, hint:’Desired Subdomain’, characterMasking: /[\d\s]/, useCharacterMasking:true, validateOn:["blur", "change"]});

I guess you get the point. Combined with Regular Expression the Spry Text Validation Widget just entered into a new level of productivity.