This script contains three masks for input controls.
They are:
- InputMask: Generic mask based on custom fields
- NumberMask: Mask for numbers based on a NumberParser
- DateMask: Mask for dates based on a DateParser
On Internet Explorer for Windows and Gecko-based browsers (FireFox, Mozilla, etc), the masks uses the
JavaScriptUtil caret operations, so that the user may type in the middle of the text.
Warning for Opera users: On Opera, masks that changes the input value (ie: NumberMask adding a group separator
or DateMask adding a '/') don't work as expected, because Opera leaves the caret on the exact position it was, and don't
offer any API to fix it. So, if the number was, let's say, 1234 (and the caret is on the 4th digit), after formatting,
it will be 1,234, and the 4th char is 3, so the caret will be BEFORE the 4. If the user type 5, the number
will become 12,354, not 12,345 as expected. If anybody has suggestions about this, please,
email me.
Also, the new NumberMask and DateMask classes are prefered over the InputMask for number and dates.
Callback functions:
In order to use the events, the mask uses the input onkeypress, onkeydown, onkeyup and onblur events. So,
if you need to use those events, the "normal" form will not work: <input onblur="alert(1)">. So, you may
pass functions on the mask properties, like blurFunction. See the examples for more details.
|
Main mask classes |
DateMask |
A mask for dates |
InputMask |
A generic mask for input controls, allowing custom formats |
NumberMask |
A mask for numbers |
SizeLimit |
The SizeLimit is not a mask for limiting wich chars are typed, but to limit the size
of a TextArea, that does not have a default way to do this |
|
Utility classes |
FieldBuilder |
The FieldBuilder helps creating individual fields to use in the InputMask |
MaskBuilder |
The MaskBuilder helps creating the field array to use in the InputMask |
|
Input field classes |
Capitalize |
An input field that capitalizes all typed characters |
Input |
A common superclass for all fields where there user input |
Literal |
Represents a fixed part of the mask |
Lower |
An input field that lowercases all typed characters |
MaskField |
A common superclass for all input field types |
Upper |
An input field that uppercases all typed characters |