Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature request: Configure thousand separator character #6

Open
strille opened this issue Oct 14, 2014 · 18 comments
Open

Feature request: Configure thousand separator character #6

strille opened this issue Oct 14, 2014 · 18 comments

Comments

@strille
Copy link

strille commented Oct 14, 2014

This directive works great. However, it would be nice to be able to configure the separator character, since many European countries use a space instead of a comma

@morgenes
Copy link

I would love to see this feature as well!

@helgadeville
Copy link

Hi,
I have redesigned a piece of this directive to make it accept locale thousands separator and decimal separator character. There are new config options: thousandsSeparator, decimalSeparator; also autoFormat option and keepThousandsOnInput have been added.

If anyone interested - please contact me at: void@buntownik.pl. In the meantime I will try to fork this project and push in new version.

@paulyoder
Copy link
Contributor

@helgadeville I would love to see your pull request. A few months ago I spent a couple hours trying to implement this feature but it got too complex, and I never found a solution that I liked.

@helgadeville
Copy link

Let's hope that I have created a good pull request :)

Greetings.

@helgadeville
Copy link

Hi Paul,

thanks for Your interest. I have created a pull request from my forked
project.
Please do check my code, as I have rewritten a large piece of Your
directive.
To keep it short:

  • default options are now initialized with decimalSeparator and
    thousandsSeparator, which are taken from .toLocaleString() JS function
    with properly formatted numbers.
    those options can be overridden
  • the "makeMaxDecimals" function has been changed to both validate for
    proper format with thousands separator and for proper number of decimal
    digits;
    this required changing both regexes
  • the "makeMaxDigits" function has been changed to use standard
    char-by-char parsing and digits counting - I could not think of an
    appropriate regex here
  • "toStandard" function has been added before isNumber() or isFinite()
    function is invoked; it will replace thousands separator with nothing
    and decimal separator
    with a dot, to provide proper input for those functions
  • auto formatting on input blur has been made optional
  • also deformatting on input focus has been made optional.

I have done some testing, but this code should be considered "hot".

Hope it helps - cause Your directive is really a good idea :)

Olga

P.S. I use it with German locale setting

W dniu 13.01.2015, 16:47, Paul Yoder pisze:

@helgadeville https://github.com/helgadeville I would love to see
your pull request. A few months ago I spent a couple hours trying to
implement this feature but it got too complex, and I never found a
solution that I liked.


Reply to this email directly or view it on GitHub
#6 (comment).

@helgadeville
Copy link

My branch version will go to our production in one week from now. The testers are satisfied; however, the testing still continues. Greetingz.

@fabiusss
Copy link

+1

@stollr
Copy link

stollr commented Mar 25, 2015

A few months ago I spent a couple hours trying to implement this feature but it got too complex, and I never found a solution that I liked.

@paulyoder Another solution would be to use Intl.NumberFormat which is supported by latest browsers and offers a build-in formatter.

Quoted from Mozilla doc:

var number = 123456.789;

// German uses comma as decimal separator and period for thousands
console.log(new Intl.NumberFormat('de-DE').format(number));
// → 123.456,789

For older brosers, you can fallback to your implementation ;-)

@uguryilmaz
Copy link

hi, are you planning to add localization support for this? this is the best working example i have ever found. but i can not use if it doesnt support localization. (. for thousand seperator , for decimal seperator)

@helgadeville
Copy link

Hi,
as mentioned above - the localization for thousand separator and decimal separator should work "out of the box". Those separators are gained by the application by using "toLocaleString()" JS function. You may override them by setting own decimal / thousand separator in configuration.
If this does not answer your question - then perhaps I have not understood Your question correctly, I am sorry.

Greetingz

@uguryilmaz
Copy link

hi, no you understand my question correctly. i just couldnt find where to configure thousand and decimal seperators. i analyzed the code but couldnt find it. if you have time could you please prepare a plunker to show that customizing of thousand and decimal seperator. i will be very happy if you can do so.. thanks..

@helgadeville
Copy link

Assuming that "app" object is Your angular application definition, see the code below.
Please note, that the "preventInvalidInput" etc. are not required :) I just put them here to show
other config options.

app.config([ 'fcsaNumberConfigProvider', function(fcsaNumberConfigProvider) {
fcsaNumberConfigProvider.setDefaultOptions({
preventInvalidInput : false, // this is just example
autoFormat : true, // another example
keepThousandsOnInput : false, // also example
decimalSeparator : ',',
thousandsSeparator : '.',
});
} ]);

@uguryilmaz
Copy link

thank you so much for your interest. i will try it, but when i look at fcsaNumber.js file, i couldnt see these variables that you mentioned. am i looking wrong file? or wrong branch? which file will i use in my project, in master branch src/fcsaNumber.js or thousands seperator branch src/fcsaNumber.js?

@helgadeville
Copy link

blockquote {padding-left: 1ex; margin: 0px 0px 0px 0.8ex; border-left: #cccccc 1px solid;} p {margin: 0px;padding: 0px;}
I am not sure which branch you check out.
 
This is the copy that should be in my branch.
 
Olga
 
 
Dnia Wtorek, 16 Czerwca 2015 12:09 Uğur YILMAZ notifications@github.com napisa³(a)

thank you so much for your interest. i will try it, but when i look at fcsaNumber.js file, i couldnt see these variables that you mentioned. am i looking wrong file? or wrong branch? which file will i use in my project, in master branch src/fcsaNumber.js or thousands seperator branch src/fcsaNumber.js?
—Reply to this email directly or view it on GitHub.
 

 

@helgadeville
Copy link

blockquote {padding-left: 1ex; margin: 0px 0px 0px 0.8ex; border-left: #cccccc 1px solid;} p {margin: 0px;padding: 0px;}
I am not sure if I attached the file.
 
Olga
 
 
Dnia Wtorek, 16 Czerwca 2015 12:09 Uğur YILMAZ notifications@github.com napisał(a)

thank you so much for your interest. i will try it, but when i look at fcsaNumber.js file, i couldnt see these variables that you mentioned. am i looking wrong file? or wrong branch? which file will i use in my project, in master branch src/fcsaNumber.js or thousands seperator branch src/fcsaNumber.js?
—Reply to this email directly or view it on GitHub.
 

 

@uguryilmaz
Copy link

there is two branches:
image

i want to use thousansdSeperator branch, but in description it say still incomplete so i couldnt be sure to use it. but if you say that i can use this branch, i will use it.

image

@helgadeville
Copy link

blockquote {padding-left: 1ex; margin: 0px 0px 0px 0.8ex; border-left: #cccccc 1px solid;} p {margin: 0px;padding: 0px;}
Hi,
 
please use another address in github:
 
https://github.com/helgadeville/angular-fcsa-number
 
There is only one branch there, like in the pic.
 
Olga
 
 
 
 
 
Dnia Wtorek, 16 Czerwca 2015 14:44 Uğur YILMAZ notifications@github.com napisał(a)

there is two branches:
i want to use thousansdSeperator branch, but in description it say still incomplete so i couldnt be sure to use it. but if you say that i can use this branch, i will use it.

—Reply to this email directly or view it on GitHub.
 

 

@Shawful
Copy link

Shawful commented Jun 24, 2016

Is this branch working (thousandsSeparator)?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants