I'm trying to make a list of the expected behavior and characteristics of a user textbox when it is designed for currency or money input.
- Numeric only.
- With two decimal places.
- With currency sign.
- With thousands separator.
Expected behavior should be:
- When the user types in, it should automatically format the value with the expected characteristics.
- As the user continues typing, the input should continue formatting the value with the expected characteristics. But while doing it, the cursor should be placed into the expected position.
- On copy-paste command, it should remove all non-numeric values and replace or add only the correct value into the textbox. (I'm not sure if this is correct)
In the expected behavior, the second one, I wanted to have a more technical understanding of how the cursor should behave. For example, as the user types in and the formatting is being executed, where should the cursor be positioned?
I am thinking of the following behavior, I am not sure if this is how it should be.
For example, if I entered
1 in an empty textbox then it should automatically format the textbox to
1.00. However, the cursor should remain at the end of the last entered digit, in this case, it should be
1[cursor should be here].00.
Also, is there any other expected behavior aside from these three and other characteristics?
I made a simple implementation of this using HTML/jQuery for more details, this isn't complete yet, for demonstration purposes only. Currency Input Demo