Using Number Mask

numberMask attribute can be defined for Text Components. Using this attribute developers can change the format of numbers. A numberMask comprises a pattern and a set of symbols. The attribute is based on Java DecimalFormat class. You can find the javascript source code in our blog.

A number mask can be applied to a textField component in the following way:

<textField numberMask="#,###"/>

In the example above, the content of the textField changes into the specified format, when the textField component loses focus. For example, if its content is set to 12345 and any other component is clicked, its content changes to 12,345.


Example Patterns

Number Mask Input Output
#,### 12345.67 12,346
#,### text text
#,###.# 12345.67 12,345.7
#,###.00# 12345.6789 12,345.679
#,##0.00# 0 0.00
#,#00.00# 1.2 01.20



Special Pattern Characters

Symbol Meaning
0 Digit
# Digit, zero shows as absent
. Decimal separator or monetary decimal separator
- Minus sign
, Grouping separator
Used to quote special characters in a prefix or suffix, for example, “‘#’#” formats 123 to “#123″. To create the single quote itself, use two in a row: “# o”clock”.