简体   繁体   中英

Auto add comma (,) in text-box with numbers

My current coding adds comma (,) when there are 4 or more digits. But instead of 1101 = 1,101 my code is doing this 1101 = 110,1... I want it to format and bring the comma to the front. My javascript

<script language="javascript" type="text/javascript">   
    function AddComma(txt) {
        if (txt.value.length % 4 == 3) {
            txt.value += ",";
        }
    }
</script>


<asp:TextBox ID="TextBox3" onkeypress="AddComma(this)" runat="server"></asp:TextBox>

How do i format so the comma is in the front 1,101 or 10,101 or 100,101.

Try this code

function Comma(Num) { //function to add commas to textboxes
        Num += '';
        Num = Num.replace(',', ''); Num = Num.replace(',', ''); Num = Num.replace(',', '');
        Num = Num.replace(',', ''); Num = Num.replace(',', ''); Num = Num.replace(',', '');
        x = Num.split('.');
        x1 = x[0];
        x2 = x.length > 1 ? '.' + x[1] : '';
        var rgx = /(\d+)(\d{3})/;
        while (rgx.test(x1))
            x1 = x1.replace(rgx, '$1' + ',' + '$2');
        return x1 + x2;
    }


<asp:TextBox ID="TextBox3" runat="server"  onkeyup = "javascript:this.value=Comma(this.value);" />

Hope this helps you.

function addComma(txt) {
    txt.value = txt.value.replace(",", "").replace(/(\d+)(\d{3})/, "$1,$2");
}

right now it supports only 3 last digits

FIDDLE <--- here

It will only accept numeric and one dot

here is the javascript

<script >

            function FormatCurrency(ctrl) {
                //Check if arrow keys are pressed - we want to allow navigation around textbox using arrow keys
                if (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) {
                    return;
                }

                var val = ctrl.value;

                val = val.replace(/,/g, "")
                ctrl.value = "";
                val += '';
                x = val.split('.');
                x1 = x[0];
                x2 = x.length > 1 ? '.' + x[1] : '';

                var rgx = /(\d+)(\d{3})/;

                while (rgx.test(x1)) {
                    x1 = x1.replace(rgx, '$1' + ',' + '$2');
                }

                ctrl.value = x1 + x2;
            }

            function CheckNumeric() {
                return event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46;
            }

  </script>

HTML

<input type="text" onkeypress="return CheckNumeric()" onkeyup="FormatCurrency(this)" />

DEMO JSFIDDLE

There are any number of functions out there to do this, here's one that inserts a thousands separator and does toFixed as well using whatever characters you specify:

// Format a number n using: 
//   p decimal places (two by default)
//   ts as the thousands separator (comma by default) and
//   dp as the  decimal point (period by default).
//
//   If p < 0 or p > 20 results are implementation dependent.
function formatNumber(n, p, ts, dp) {
  var t = [];
  // Get arguments, set defaults
  if (typeof p  == 'undefined') p  = 2;
  if (typeof ts == 'undefined') ts = ',';
  if (typeof dp == 'undefined') dp = '.';

  // Get number and decimal part of n
  n = Number(n).toFixed(p).split('.');

  // Add thousands separator and decimal point (if requied):
  for (var iLen = n[0].length, i = iLen? iLen % 3 || 3 : 0, j = 0; i <= iLen; i+=3) {
    t.push(n[0].substring(j, i));
    j = i;
  }
  // Insert separators and return result
  return t.join(ts) + (n[1]? dp + n[1] : '');
}

console.log(formatNumber(1101, 0)); // 1,101

i made this for my project. it's also removes all letters.

 $('#inputNumber').on('keydown keyup', function() { this.oldVal = this.value.replace(/\\D/g, ''); this.value = Number(this.oldVal).toLocaleString(); })
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input id="inputNumber" type="text">

Assuming you have a string representation of a number:

function formatNum(str){
    var ind=str.length%3;
    return str.length > 3 ? (str.slice(0,ind)+','+str.slice(ind).match(/\d{1,3}/g).join(',')) : str;
}

If it's a number, not a string, then you can use toString() to change it to a string first.

您可以将 jquery.numberbox.js 用于此类任务。

you may use this also.

<script type="text/javascript">
function addcommas(x){

var thisVal = x.value;
thisVal = thisVal.replace(/,/g, '');
var thischar = ""+thisVal;

var firstval = thischar.split(".")[0];
var secondval = thischar.split(".")[1];

if(secondval==""  || secondval==undefined){secondval = "";}
else{secondval = "."+secondval;}

var chkmod = parseInt(firstval.length)%3;
var spclcon = parseInt(firstval.length)%3;
var chkdiv= parseInt(parseInt(firstval.length)/3);

    if(firstval.length > 3)
    {
        last5 = firstval.substr(0,chkmod);

        for(i=1;i<=chkdiv;i++){
            last5+= ","+firstval.substr(chkmod,3);
            chkmod = chkmod+3;
        }

        if(spclcon==0){last5 = last5.substr(1,last5.length-1)}
         return x.value = last5+""+secondval;
    }
    else{
        return x.value = firstval+""+secondval;
    }
}


</script>

Here is a modification to @Engineeration's answer simply casting Num to string and doing a global replace (one time) of any existing commas:

function Comma(Num) { 
    Num = Num.toString().replace(/,/g, '');
    x = Num.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1))
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    return x1 + x2;
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM