JavaScript caret position JavaScript caret position android android

JavaScript caret position


I don't know about autoNumeric, but http://code.google.com/p/jquery-formatcurrency/ looks pretty good. The jsFiddle example you posted doesn't place the caret correctly on my desktop browser, but this does, and on my (Jellybean) Android phone as well. (On Gingerbread, the blinking cursor bar may jump to the end of the line, but you will still be editing where it last was.) Try their demo: http://www.bendewey.com/code/formatcurrency/demo/format_as_you_type.html


I usually use accounting.jsYou can download it from http://openexchangerates.github.io/accounting.js/#download

It's quite easy to use. You can see how it works from that same download page.

I created a couple javascript functions which i use to do the cursor management:

        function formatMoney(myField){            if(myField.selectionStart || myField.selectionStart == '0'){                var len = myField.value.length;                var caretPos = doGetCaretPosition(myField);                myField.value = accounting.formatMoney(myField.value);                var newlen = myField.value.length;                setCaretPosition(myField, newlen != len ? (newlen > len ? caretPos + 1 : caretPos - 1) : caretPos);            }        }        function doGetCaretPosition (ctrl) {            var CaretPos = 0;            // IE Support            if (document.selection) {                ctrl.focus ();                var Sel = document.selection.createRange ();                Sel.moveStart ('character', -ctrl.value.length);                CaretPos = Sel.text.length;            }            // Firefox support            else if (ctrl.selectionStart || ctrl.selectionStart == '0')                CaretPos = ctrl.selectionStart;            return (CaretPos);        }        function setCaretPosition(elem, caretPos) {            elem.value = elem.value;            if(elem != null) {                if(elem.createTextRange) {                    var range = elem.createTextRange();                    range.move('character', caretPos);                    range.select();                }                else {                    if(elem.selectionStart) {                        elem.focus();                        elem.setSelectionRange(caretPos, caretPos);                    }                    else                        elem.focus();                }            }        }

You can use the functions with the text field as:

<input id="myField" type="text" onkeyup="formatMoney(this);" onChange="formatMoney(this);" onBlur="formatMoney(this);" />

The getting and the setting caret position functions were gotten from here: Set keyboard caret position in html textbox

I tested it on Android 2.1 emulator. Though the emulator was slow but it seemed to be working. You can find the screenshot here: https://www.dropbox.com/s/9ximuwh64kadiea/shot.JPG?dl=0


Here's an open source, well contributed, well commited library : https://github.com/plentz/jquery-maskmoney

Seems to answers your need, doesn't it ?Havent't tested it under Android though.