I am trying to format an input number to two decimals as suggested in HTML5 Number Input - Always show 2 decimal places, but it disrupts the possibility to undo the input.
Is there a way to format numbers while keeping undo?
Try the following:
<input value="1.11" id="i"
onchange="this.value=parseFloat(this.value).toFixed(2)">
<br>Change ↑ to 1.111, hit tab
and try to undo.Type a number then remove focus, it changes to the desired format. But you are not able to ctrl-Z back.
Sadly, this is intended behavior. Last browser that kept history entries of text fields values even across "external" script alterations used to be Firefox, but it allegedly posed performance drawbacks, especially in comparison with other browsers discarding history, so it had been crippled to match them. (See https://bugzilla.mozilla.org/show_bug.cgi?id=1523270 )
Takeaway as I understand is that to keep user's undo history for altered field you have to roll your own history management, for which there does not seem that sufficiently reliable APIs exists. So the only option seems to be storing history manually, hijacking keyboard events and listening to key combinations that could normally trigger undo. What sound quite futile.
