How to handle number text field change with symbol?

Question

I have a text field that allows to edit. The textfield display number along with symbol. For example $ 45, 21 lbs

There are 2 solutions that come into mind

1. When user starts editing, we remove the symbol. Wait for user to finish editing the textfield (keyboard is dismissed) then we check the number and append the symbol.

2. Check and append the symbol appropriately while user is editing (keyboard is still showing). This sounds more naturally but requires more handling. With 21 lbs, when user starts editing, the cursor is right after the word lbs, and user wants to change from 21 to 2. How to handle in this case

What might be the most appropriate solution?

Answer 1

Does this work for you?

if the units need to be editable then make it a drop down link showing valid unit types

Answer 2

I would go with option 2.

You want to keep the user informed of the units that they are entering. Ie look at the meters vs feet fiasco with the mars rover. Sure you app may not be as critical but you should treat every application as if a avoiding User Errors is of the utmost priority.

Also a user could be going through the form and have something break their attention. a text a phone call a physical interruption and then look back down and forget what the units were and enter something assuming the wrong set of units.

I would choose option 1 if you cant afford the screen real estate and then i would maybe show them the units the first 3 times or so to help them remember then remove it if you think its taking up too much space.