Primeng: I want to input number and insert comma by 3-digits

Created on 22 Nov 2016  路  6Comments  路  Source: primefaces/primeng

I'm submitting a ... (check one with "x")

[ ] bug report => search github for a similar issue or PR before submitting
[x] feature request
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Current behavior

There is no way to auto insert comma between three digits three-digits.

Expected behavior

I want add comma between three digits three-digits when input data was number.
Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

I'll input big number, for example , 10000000000. So I want to add comma for example 10,000,000,000,
and when submit, I want number of 10000000000(without comma.).
I tried to this by use input mask.

<p-inputMask name="testMask" [(ngModel)]="val" mask="?999,999,999,999,999,999" unmask="true" slotChar=""></p-inputMask>

but this solution is not good because if I input 10000, viewed number is 1000,0, but I want 10,000.

Please tell us about your environment:

WebStorm,npm, and webpack

  • Angular version: 2.0.0
  • PrimeNG version: 1.0.0-rc.4

  • Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

    Chrome

  • Language: [all | TypeScript X.X | ES6/7 | ES5]
    all

  • Node (for AoT issues): node --version =
    v6.7.0

Please add mask input to insert comma to number input .

Thank you.

All 6 comments

You can have exactly what you want using this component:
https://github.com/cesarrew/ng2-currency-mask

Only you have to do is setup like this:

<!-- If you want only thousands separator -->
 <input currencyMask [(ngModel)]="value" [options]="{ prefix: '', thousands: ',', decimal: '' }"/>

<!-- If you want decimal separator as well -->
 <input currencyMask [(ngModel)]="value" [options]="{ prefix: '', thousands: ',', decimal: '.' }"/>

Thank you very much for recommend your product!
I tried ng2-currency-mask and I can input three digit number.
Would primeNG team plan to implement this function in the future in PrimeNG?

You're welcome.
I don't know, but I hope so...

Actually Inputmask is used to mask certain positions with certain characters. You want to port inputNumber features(https://www.primefaces.org/showcase/ui/input/inputNumber.xhtml) in Inputmask

Thank you. It's function that I want.
Do you know it's planned or not to loadmap?

On our side, we'll create inputNumber component for this, input mask is for masking only. Demo from PrimeFaces side;

https://www.primefaces.org/showcase/ui/input/inputNumber.xhtml

Closing as it is a duplicate for InputNumber requirements which is tracked #1109

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Faigjaz picture Faigjaz  路  3Comments

mitosandov picture mitosandov  路  3Comments

miresk picture miresk  路  3Comments

Helayxa picture Helayxa  路  3Comments

SchneMa picture SchneMa  路  3Comments