For currency values, many locales (Dutch, for example) use the period (.) as the thousand separator and the comma (,) as the decimal separator, for example, 123.456.789,00. Some locales (French, for example) use a non-breaking space for the decimal separator. The number of digits within a separated group may also vary between three (3) and four (4).

Using your Pega application in the Google Chrome browser in a locale that uses the comma (,) as the decimal separator, you notice that work form fields for entering currency amounts do not work as expected.

Example

In a work form that uses the Pega-provided pxCurrency control for a decimal property of type pxNumber, Internet Explorer treats the following user-specified values as valid:

1.234,56

4,50

12

1234,56

4.2

However, Chrome does not handle the values containing commas. The only values in this example that Chrome displays correctly are 12 and 4.2.

For locales that require the comma (,) as the decimal separator for currency values, you are unable to enter amounts in the correct format if you are using Chrome.

This problem occurs in the Chrome browser only; it does not occur in Internet Explorer.

Explanation

Chrome does not allow users to specify currency values with the period (.) as the thousand separator and the comma (,) as the decimal separator. This is a problem for locales that use this currency notation.

Chrome does not support the comma for the HTML5 element input type=”number”. When users type a number with comma, Internet Explorer fires a change event on tab out, whereas Chrome does not fire any change event.

Investigation finds that the fundamental problem lies with the HTML5 element input type=”number”, not with the Chrome browser. As the last two references in this article indicate, cross-browser support for HTML5 input type=”number” is inconsistent.

Suggested approach

To resolve this problem, perform the following steps:

1. Copy (Save As) the Pega-provided control pxCurrency and, for the Editable mode, change the Format Type from Number to Text.
2. Use your custom copy of the pxCurrency control for the decimal property in the work form, instead of the Pega-provided pxCurrency control.

This local change has been successful for both Internet Explorer and Chrome.

Alternative approach

You might want to change the input type=”number” step attribute step=1 (default value) to step=“any”. See the last two references cited below for more information.

Best practice

If possible, try not to specify currency values with more than two (2) decimal places, for example, 1234,567.

Currency fields that are read-only display values by rounding them to the nearest two decimal places. Therefore, the value entered as 1234,567 in a currency field of a work form might be displayed as € 1.234,57, depending on your locale setting.

Additional information

For related information, search My Support Portal for SA-1930, Error with decimal property when operator has nl_NL. Locale.

References

HTML Markup, input number

Localization of input type number

Chrome auto formats input=number

Comma? Dot? Input Type=“Number” is a Mess!

How to handle floats and decimal separators with html5 input type number