How to mask Datefield in Flex?

Question

Does anyone know how to mask the input in a DateField in flex?

Our DateField uses the format DD/MM/YYYY.

Our users want:

• to be able to type the date in without having to type in the slash
• still be able to use the date selection in the date chooser (the drop down on the date field)

I google’d and found ways to do this with 3 text boxes. I would prefer to have a DateField control. That way the users would be able to make use of the date chooser (drop down) as well.

Answer 1

I would suggest adding a KeyboardEvent to the DateField, and handle the logic of adding or removing slashes inside the event listener function.

Answer 2

I found the best way to do this is onFocusOut I take the text and add the slashes back and reset the formatted text, before any validation fires.

Full Code post to follow: