uNmAnNeR / imaskjs

vanilla javascript input mask

Home Page:https://imask.js.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Using dot as thousand seperator and comma as radix ignores the dot on pre-filled values

Roboroads opened this issue · comments

Describe the bug
Using dot as thousand seperator and comma as radix ignores the dot on pre-filled values

To Reproduce
https://jsfiddle.net/roboroads/udrqfj9s/11/

Expected behavior
I would like to use dutch currency notation (1.000.000,00). If I pre-fill a form with a 1234.56 number, I would expect 1.234,56

Environment:

  • OS: Ubuntu
  • Browser Chrome
  • Version: 117.0.5938.92
  • IMask version: 7.1.3
  • Framework/plugin version if used: N/A

Additional context
As said, this is dutch standard number notation.

I can confirm this issue.
We are using angular-imask, but I finally concluded that the problem is with the imask package.
6.4.3 still works fine.
Here is my example:
https://stackblitz.com/edit/typescript-9j7nvy?file=index.ts
In this example, only from version 6.5.1, but in @Roboroads 's example, from version 6.5.0-alpha.0 is no good.
The input can be filled with any fractional number (e.g. 1,2).
The problem can be reproduced by setting the language selector.
Hu -> En, Ge -> En, En -> Hu, En -> Ge (still good: Hu -> Ge, Ge -> Hu)

We really like the imask package.
Thank you for your efforts.
If this problem could be fixed, it would be greatly appreciated.

I can also confirm this issue.

This is our setup:

{
  mask: Number,
  scale: 2,
  signed: false,
  thousandsSeparator: '.',
  padFractionalZeros: true,
  normalizeZeros: false,
  radix: ',',
  mapToRadix: ['.'],
  max: 9999999.99
}

While we were on 6.4.3, values with a dot as a decimal separator were parsed correctly:
1000.0 -> 1.000,00
12345.67 -> 12.345,67

On 6.5.0 this stopped working properly as the decimals were ignored:
1000.0 -> 1.000,00
12345.67 -> 12.345,00

But 7.1.3 introduced an even bigger issue, where the whole number is being interpreted as an integer:
1000.0 -> 10.000,00
12345.67 -> 1.234.567,00

hello guys. for me it works as expected. You are using input value to prefill data. Using this field actually means that you should use masked values because value is masked. But in your examples you prefill value with unmasked values so this does not work as expected. If you want to set up the initial value with unmasked data the only way to do it is to call imask.unmaskedValue = <your unmasked data>.
In case of using same symbols for thousandsSeparator / mapToRadix i don't see other way to solve it.
hope it will help

What worked for me is passing the raw: true flag in resolve function.

masker.resolve(<your raw input>, { input: true, raw: true })

Also, as per the code

  /*
    radix should be mapped when
    1) input is done from keyboard = flags.input && flags.raw
    2) unmasked value is set = !flags.input && !flags.raw
    and should not be mapped when
    1) value is set = flags.input && !flags.raw
    2) raw value is set = !flags.input && flags.raw
  */