[Custom Input Masks] Limit no of digits before decimal on input

Forge Component
(32)
Published on 22 Apr by Marcelo Ferreira
32 votes
Published on 22 Apr by Marcelo Ferreira

Hi,

I have an input field where a user can type only 4 numbers before the decimal place and a maximum of 2 decimal digits. So acceptable values: 1111, 0.12, 1111.12, 11.12, 1.1

I have tried to achieve this using the mask text, however when I use the following advanced options:

"{regex: '^([0-9]{0,4})(\\.[0-9]{0,2})?$', autoUnmask: false}"

Regex explanation

  1. ^([0-9]{0,4})               #start the expression and input digits only upto 4 places
  2. (\\.[0-9]{0,2})?$         #optional decimal digits upto max of 2 places till end of expression

The regex works but the 'dot' character is automatically typed on the input whenever the user types more than 4 digits. I tried escaping it with a single backslash but it doesn't work. I want the user to type the 'dot' explicitly because this way if the user presses "backspace" to erase the 'dot' from the input, the number before the 'dot' is also erased.

Another approach I tried was using the Mask number instead of mask text but I could only limit the number of decimal digits and not the number of digits before the decimal.

Can anyone let me know what is the correct way to do this?

Hi,

Check if this 

SyntaxEditor Code Snippet

"{regex: '^([0-9]{0,4})([\\.]{1}[0-9]{0,2})?$', autoUnmask: false}"

Does what you want. Keep in mind if you have 1234.56 and just remove the dot (on field you will see 123456) and submit after, everything that is not the first 4 numbers will be ignored. In this case just 1234 will be submitted

Regards,

Marcelo