jump to navigation

Currency TextBox with Javascript April 24, 2009

Posted by codinglifestyle in Javascript.
Tags: , , , ,

This took me a long time so here it is for prosperity.  I started by looking at Ajax’s masked edit field in order to enforce a simply currency field.  This was a waste of time and not up for the job.  I accomplished it with javascript instead.  Very simple, no symbols, just #####.## with the cents being optional. 

Here is the script:


**  Returns the caret (cursor) position of the specified text field.

**  Return value range is 0-oField.length.


function doGetCaretPosition(oField) {


    // Initialize

    var iCaretPos = 0;


    // IE Support

    if (document.selection) {


        // Set focus on the element



        // To get cursor position, get empty selection range

        var oSel = document.selection.createRange();


        // Move selection start to 0 position

        oSel.moveStart(‘character’, -oField.value.length);


        // The caret position is selection length

        iCaretPos = oSel.text.length;



    // Firefox support

    else if (oField.selectionStart || oField.selectionStart == ‘0’)

        iCaretPos = oField.selectionStart;


    // Return results

    return (iCaretPos);



function fnCurrencyOnly(o) {

    var sValue = o.value;

    var sKey = String.fromCharCode(window.event.keyCode);

    var range = document.selection.createRange();

    var pos = doGetCaretPosition(o);


    if (range.text == sValue) {

        sValue = sKey;

    } else {

        sValue = sValue.substr(0, pos) + sKey + sValue.substr(pos);


    var re = new RegExp(“^\\d+(?:(\\.|\\,)\\d{0,2})?$”);

    if (!sValue.match(re))

        window.event.returnValue = false;




        <input type=”text” onkeypress=”fnCurrencyOnly(this);” />



I’m sure sure who the original author is, but I found the script for doGetCaretPosition() here: http://blog.vishalon.net/index.php/javascript-getting-and-setting-caret-position-in-textarea/




No comments yet — be the first.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: