RE: [flexcoders] TextInput and masking

Sat, 13 May 2006 14:49:56 -0700

TextInput has a 'restrict' property that lets you specify the set of characters that can be typed. But it doesn't have masking support, such as "NNN-NN-NNNN" for entering a social security number.

To implement masking, you'd need to handle the "textInput" event. If you call event.preventDefault() in your handler, you can prevent the text from being entered.

Here's a quick-and-dirty example of SSN masking. It ensures that the first three characters you type must be a digit, the next must be a hyphen, etc. It doesn't do the right thing if you move the insertion point or select text and then type.

- Gordon

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

      <mx:Script>
      <![CDATA[

            private var masks:Array =
            [
                  null,
                  new RegExp("\\d"),
                  new RegExp("\\d\\d"),
                  new RegExp("\\d\\d\\d"),
                  new RegExp("\\d\\d\\d\\-"),
                  new RegExp("\\d\\d\\d\\-\\d"),
                  new RegExp("\\d\\d\\d\\-\\d\\d"),
                  new RegExp("\\d\\d\\d\\-\\d\\d\\-"),
                  new RegExp("\\d\\d\\d\\-\\d\\d\\-\\d"),
                  new RegExp("\\d\\d\\d\\-\\d\\d\\-\\d\\d"),
                  new RegExp("\\d\\d\\d\\-\\d\\d\\-\\d\\d\\d"),
                  new RegExp("\\d\\d\\d\\-\\d\\d\\-\\d\\d\\d\\d")
            ];
                       
            private function textInputHandler(event:TextEvent):void
            {
                  var newText:String = ssn.text + event.text;
                  var mask:RegExp = masks[newText.length];
                  if (!mask || !mask.test(newText))
                        event.preventDefault();
            }

      ]]>
      </mx:Script>

      <mx:TextInput id="ssn" textInput="textInputHandler(event)"/>

</mx:Application>

- Gordon


-----Original Message-----
From: [email protected] [mailto:[EMAIL PROTECTED] On Behalf Of sof4real03
Sent: Saturday, May 13, 2006 8:44 AM
To: [email protected]
Subject: [flexcoders] TextInput and masking

Is there a simple way of enabling a text input mask on the control or
do you need to write a custom component to extend the features
available with the textInput?








--
Flexcoders Mailing List
FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt
Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com
Yahoo! Groups Links









--
Flexcoders Mailing List
FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt
Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com



SPONSORED LINKS
Web site design development Computer software development Software design and development
Macromedia flex Software development best practice

YAHOO! GROUPS LINKS



Reply via email to