Handy Masked Input Component for Flex
I was working on a Flex application yesterday and I wanted to create a textbox wih a mask on it, such that the user could see what format they needed to provide their value in. It seemed to me that I had seen this somewhere in Flex. The actual implementation that I was thinking of, was not in Flex, it was in C#.
I did some Googling on the idea and pretty quickly found Peter Ent’s blog and an article on a masked text input custom component that he created and opened up.
After downloading the component, I immediately found it very useful and easy to use! (I {heart} Flex!).
The particular mask I needed to use was the “A” mask. This is any character, but unlike the other masks (c and C) it would not upper or lower my case based on the case of the mask. In addition, it was allowing special characters when I only wanted to allow alpha and numeric characters. It was time for a little contribution.
I added the ability to use ‘a’ or ‘A’ and have it follow the proper case for that letter. In addition, I added a new mask, ‘b’ and ‘B’, which matched only numeric and alpha but no special characters (I used a simple regex for this [0-9a-zA-Z]). Naturally I kept Peter’s original style in the code, which was quite nice by the way.
Now it works the way I want it to in my application!
Read more about this component at Peter’s blog.
You may download my updated version by clicking Download below.
From → Flex
Leave a Reply Cancel reply
Note: HTML is allowed. Your email address will not be published.
Subscribe to this comment feed via RSS
Hey Kyle,
Cant seem to download it, where is the link? I might be blind.
Absolutely right, Josh, should be fixed now!
weblogs.macromedia.com/pent/maskedInput/MaskedInput.zip
Pretty cool but you’ve got a bug..
If you have a text field "Ccccccc" and just keep hitting space then the box continues to grow even though I have a maxchars="20" set. It just keeps going and going. Once it’s beyond 20 chars you can’t type any other characters but space.