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

[Bug] ngx-currency cannot handle the full-width characters/numbers input #202

Open
JoeyWu123 opened this issue Sep 5, 2024 · 0 comments

Comments

@JoeyWu123
Copy link

JoeyWu123 commented Sep 5, 2024

First of all, thank you for this library, it is indeed quite helpful.
I am using the version V3.0.0. As the later version isn't compatible with the Angular version used by our project. However, during the recent tests, I find that ngx-currency malfunctions while users input full-width charfacters/numbers. In simplicity, you can input Chinese characters into input box with ngx-currency. Although these Chinese characters would be regarded like non-existence if you are binding the input box value to background variable using ngModel. Please see the screenshot:

image

There are more problems while going to mobile device. On mobile phone, we want to have number pad popped up white inputting just number, so we add

inputmode="decimal"

attribute to input box. However, if your phone is in Chinese (or Japanese, Korean), what the number pad inputs is full-width numbers (on IOS device); they cannot be handled by ngx-currency, please see screenshot
image

I tried modifying the source code to fix this problem. Here is the link of my commit
master...JoeyWu123:ngx-currency:Full-Width-Input
With this code change, full-width numbers can be handled as same as half-width numbers (so there is no problem with mobile device now). And the full-width characters (Chinese characters) can also be rejected. However, on MS Edge and Chrome, if you input a Chinese character, the input would be rejected, meanwhile one number before the cursor would also be removed (like you press "backspace" key). There is no such problem detected on Firefox. So the fix is still imperfect.

Could you please let me know what I can do as next step? Should I submit a pull request? Or would you modify the code at your end based on my commit? If so, could you please also bring change to V3.0.0 as it's the version I needed? Thank you very much.

Oh one more thing, if you are unsure about full-width characters stuff. You may ask ChatGPT or Copilot. They can give you more straightforward information. And in Chinese, we input characters according to pronunciation (the most popular way). For example, we type "n" and then "i" to input character 你 (which means "you"). The input isn't completed if you just press single key "n" (This is called IME, input method editors). That's why handleKeyDown or handleKeyPress may not catch Chinese characters. And you may need to use handleInput.
However, I notice in currency-mask.directive.ts, the original code is

handleInput(event: any) {
if (this.isChromeAndroid()) {
!this.isReadOnly() && this.inputHandler.handleInput(event);
}

while the other code is like (please notice ! symbol in this.isChromeAndroid())

handleKeydown(event: any) {
if (!this.isChromeAndroid()) {
!this.isReadOnly() && this.inputHandler.handleKeydown(event);
}
}

so I am curious why it's not

handleInput(event: any) {
if (!this.isChromeAndroid()) {
!this.isReadOnly() && this.inputHandler.handleInput(event);
}

Is this a bug? What's the purpose to add "!this.isChromeAndroid()" condition? Actually after I change it to

handleInput(event: any) {
if (!this.isChromeAndroid()) {
!this.isReadOnly() && this.inputHandler.handleInput(event);
}

The input box can reject Chinese characters

@JoeyWu123 JoeyWu123 changed the title ngx-currency cannot handle the full-width characters/numbers input [Bug] ngx-currency cannot handle the full-width characters/numbers input Sep 5, 2024
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

1 participant