onkeyup javascript function does not work properly on input field

Question

I have a function to convert an integer to indian rupees format. It works on onclick event function and give it result, but when it is apply on onkeyup event it doesn't work. Where is the problem?

my function is below.

function numberWithCommas(x) {
    x = x.replace(",", '');
    x = x.toString();
    var lastThree = x.substring(x.length - 3);
    var otherNumbers = x.substring(0, x.length - 3);
    if (otherNumbers != '')
        lastThree = ',' + lastThree;
    var res = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree;
    return res;
}


function numberformat() {
    var n = document.getElementById('in_no').value;
    alert(numberWithCommas(n));
}

html is

<input type="text" id="in_no" />
<button onclick="numberformat()">Test</button>
<input type="text" id="in_no1" onkeyup="numberWithCommas(this.value)" />

if we create a another function like

    function numberformat1(id){
    var n = document.getElementById(id).value;
    var n = numberWithCommas(n);
  document.getElementById('in_no1').value = n;

}

and html change to

    <input type="text" id="in_no1" onkeyup="numberformat1('in_no1')"/>

it works but the result is like 2,0,0,0,0,000 instead of 2,00,00,000

Answer 1

1) Replace onkeyup="numberWithCommas(this.value)" with onkeyup="numberWithCommas(this)" .

2) Since we are passing the element by reference now, do this:

 function numberWithCommas(x) { var elem = x; var x = x.value.replace(/,/g, ''); var lastThree = x.substring(x.length - 3); var otherNumbers = x.substring(0, x.length - 3); if (otherNumbers != '') lastThree = ',' + lastThree; var res = otherNumbers.replace(/\\B(?=(\\d{2})+(?!\\d))/g, ",") + lastThree; elem.value = x; } 

 No commas in here: <input type="text" id="in_no1" onkeyup="numberWithCommas(this)" />