How do i add a comma to a number in html?

Question

I am wanting to display large numbers more nicely with commas. So if the number was say 123456789, it would display 123,456,789. I have looked around but I only found code that just wouldn't work the way I wanted so I was hoping I could find some help here. Also, I hope it is also dynamic, so the commas will change as the number changes.

Nội dung chính Show

How do you add a comma to a number in HTML?
How do I display large numbers with commas in HTML?
How do you put a comma in input type numbers?
How do you put a comma after 3 digits?

The number that I want to affect has the id="value".

That should be all, I don't think I am missing anything. So again I want the number with an id="value" to have commas introduced when it's needed. If you need any more information please let me know!

asked Jan 4, 2015 at 1:46

2

You can use toLocaleString:

num.toLocaleString('en', {useGrouping:true})

answered Jan 4, 2015 at 1:51

OriolOriol

257k57 gold badges409 silver badges493 bronze badges

1

This was answered here:

How to print a number with commas as thousands separators in JavaScript

In case you're not interested in reading the answer above, the code given was this:

function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

If you're using jquery use something like:

var val = parseInt($('#value').text());
//Use the code in the answer above to replace the commas.
val = numberWithCommas(val);
$('#value').text(val);

answered Jan 4, 2015 at 1:51

6

There's a simpler syntax for toLocaleString:

Number(x).toLocaleString();

This lets you drop the number in as a variable instead of converting the number into an object.

answered Apr 3, 2018 at 12:31

NelsonNelson

1,90316 silver badges21 bronze badges

1

The toLocaleString method lets us format a number to a string with commas as thousands of separators automatically. You can do HTML input number format comma with it.

const str = (1234567890).toLocaleString()
console.log(str)

Or using autoNumeric plugin you can make a field as numeric input with different separators.

Simple example code create a mask input displaying the formatted number.

Output:

How do i add a comma to a number in html?

More: https://github.com/autoNumeric/autoNumeric

Do comment if you have any doubts or suggestions on this HTML number topic.

Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.
OS: Windows 10
Code: HTML 5 Version

Degree in Computer Science and Engineer: App Developer and has multiple Programming languages experience. Enthusiasm for technology & like learning technical.

How do you add a comma to a number in HTML?

The toLocaleString method lets us format a number to a string with commas as thousands of separators automatically. You can do HTML input number format comma with it. Or using autoNumeric plugin you can make a field as numeric input with different separators.

How do I display large numbers with commas in HTML?

There's a simpler syntax for toLocaleString: Number(x). toLocaleString();

How do you put a comma in input type numbers?

You can use type="text" and then add commas to the number in the onchange event.

How do you put a comma after 3 digits?

Continue to place a comma after every third digit. For example: $1,000,000 (one million dollars) 123,456 (one hundred and twenty-three thousand, four hundred and fifty-six)

programming html toLocaleString Format number js toLocaleString format number minimumFractionDigits

How do i add a comma to a number in html?

How do you add a comma to a number in HTML?

How do I display large numbers with commas in HTML?

How do you put a comma in input type numbers?

How do you put a comma after 3 digits?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội