jQuery plugin to add comma separating numbers into three digits without white spaces and if total digits are under three, then no comma added.
Ex. 2984 => 2,984 and 297312984 => 297,312,984 and 298 => 298
$('span.rawNums').digits();
Thanks.
+4
A:
You could try NumberFormatter.
$(this).format({format:"#,###.00", locale:"us"});
It also supports different locales, including of course US.
Here's a very simplified example of how to use it:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.numberformatter.js"></script>
<script>
$(document).ready(function() {
$(".numbers").each(function() {
$(this).format({format:"#,###", locale:"us"});
});
});
</script>
</head>
<body>
<div class="numbers">1000</div>
<div class="numbers">2000000</div>
</body>
</html>
Output:
1,000
2,000,000
Mark Byers
2010-01-02 03:33:19
I took a glance at this plugin and from author description, it was meant to be used in form input fields. How can I adopt it to be applied to <span class="numbers">2984</span> so it formats to <span class="numbers">2,984</span> without decimals. I tried $('span.numbers').format({format:"#,###", locale:"us"}); but nothing happend. Still examing plugin, playing around with it. Sorry I am a jQuery newbie :-)
2010-01-02 04:13:56
+1 Great to know about this plugin. I agree that for growth and future internationalization, this would be the best route to follow.
Doug Neiner
2010-01-02 04:35:15
Thanks Mark. Nice quick tutorial.
2010-01-03 05:17:25
+1
A:
You can also look at the jquery FormatCurrency plugin, it has support for multiple locales as well, but may have the overhead of the currency support that you don't need.
$(this).formatCurrency({ symbol: '', roundToDecimalPlace: 0 });
bendewey
2010-01-02 03:45:07
+3
A:
This is not jQuery, but it works for me. (I did not write this, but I do not recall where I got it.)
function addCommas(nStr) {
nStr += '';
x = nStr.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;
}
Ray
2010-01-02 03:45:55
+4
A:
Something like this if you're into regex, not sure of the exact syntax for the replace tho!
MyNumberAsString.replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
Paul Creasey
2010-01-02 03:50:52
The syntax is right. '999.9999'.replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") returns '999.9,999' though.
Mark Byers
2010-01-02 04:00:38
@Unknown, I moved it to an answer. It is farther down on this page with usage example.
Doug Neiner
2010-01-02 04:25:51
+2
A:
@Paul Creasey had the simplest solution as the regex, but here it is as a simple jQuery plugin:
$.fn.digits = function(){
return this.each(function(){
$(this).text( $(this).text().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") );
})
}
You could then use it like this:
$("span.numbers").digits();
Doug Neiner
2010-01-02 04:18:30
Works perfectly! Thanks to Paul Creasey for simply, elegant code and thanks to Doug Neiner for putting it in plugin format. Credit given to both.
2010-01-02 04:31:58
RC @Mark Byers The syntax is right. '999.9999'.replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,") returns '999.9,999' though.
bendewey
2010-01-02 04:44:22
@bendewey the OP didn't update his question, but he did add this comment "Positive numbers only, no fractions, no decimals, no currency involved, and standard U.S. format" which @Paul Creasey's answer provided.
Doug Neiner
2010-01-02 04:49:42