NumberMask is a mask that accepts only numbers, and uses a NumberParser to format and parse the text on an input field. Several mask instances can (and should!) share a single parser.
The NumberParser instance is passed on the constructor, as well as the field name or reference. Optionally, it can receive a third argument, the maximum digits on the integer part. The other constructor parameters are event handlers, and are not recommended to be passed on the constructor. For more details on the event handlers, see here.
The mask can be typed from left to right or from right to left. Many applications (specially for currencies)
prefer the right to left, so, it's the default. In this mode, assuming 2 decimal places, if the user presses,
in this order, 123456, the resulting number is 1.234,56. Only numbers are typed. In this mode, the parser is required
to restrict the number of digits on the decimal part (using the decimalDigits property). On the left to right mode,
to type the same number, the user should type 1234,56 (including the decimal separator). This mode is better if
more decimal places are accepted. Unlimited decimal digits is also supported in this mode. To set the typing mode,
leftToRight property with a boolean value (true means left to right and false means right to left).
The number of digits on the integer part may be limited using the
(-1 means no limit). The NumberMask may also accept or not the user to change the number signal (using the minus key)
It is also possible to set / retrieve the input text using numbers, with the
Here are some examples (assuming an input field called myNumber):
//We need a NumberParser instance var parser = new NumberParser(...); //Here is the basic usage new NumberMask(parser, "myNumber"); //Now we will customize it a little var mask = new NumberMask(parser, "myNumber"); mask.allowNegative = false; mask.leftToRight = false; //Assigning the value with a number mask.setAsNumber(1234.56); //Would display something like "1.234,56" on the input //Retrieving the value as a number alert(mask.getAsNumber() * 3);
Working with the InputMask
|Table of Contents||Next:
Working with the DateMask