Format number to always show 2 decimal places
(Math.round(num * 100) / 100).toFixed(2);
Live Demo
var num1 = "1";
document.getElementById('num1').innerHTML = (Math.round(num1 * 100) / 100).toFixed(2);
var num2 = "1.341";
document.getElementById('num2').innerHTML = (Math.round(num2 * 100) / 100).toFixed(2);
var num3 = "1.345";
document.getElementById('num3').innerHTML = (Math.round(num3 * 100) / 100).toFixed(2);
span {
border: 1px solid #000;
margin: 5px;
padding: 5px;
}
<span id="num1"></span>
<span id="num2"></span>
<span id="num3"></span>
How do I display a decimal value to 2 decimal places?
decimalVar.ToString("#.##"); // returns ".5" when decimalVar == 0.5m
or
decimalVar.ToString("0.##"); // returns "0.5" when decimalVar == 0.5m
or
decimalVar.ToString("0.00"); // returns "0.50" when decimalVar == 0.5m
Formatting a number with exactly two decimals in JavaScript
To format a number using fixed-point notation, you can simply use the toFixed method:
(10.8).toFixed(2); // "10.80"
var num = 2.4;
alert(num.toFixed(2)); // "2.40"
Note that toFixed()
returns a string.
IMPORTANT: Note that toFixed does not round 90% of the time, it will return the rounded value, but for many cases, it doesn't work.
For instance:
2.005.toFixed(2) === "2.00"
UPDATE:
Nowadays, you can use the Intl.NumberFormat
constructor. It's part of the ECMAScript Internationalization API Specification (ECMA402). It has pretty good browser support, including even IE11, and it is fully supported in Node.js.
const formatter = new Intl.NumberFormat('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: 2,
});
console.log(formatter.format(2.005)); // "2.01"
console.log(formatter.format(1.345)); // "1.35"
How can I format a decimal to always show 2 decimal places?
I suppose you're probably using the Decimal()
objects from the decimal
module? (If you need exactly two digits of precision beyond the decimal point with arbitrarily large numbers, you definitely should be, and that's what your question's title suggests...)
If so, the Decimal FAQ section of the docs has a question/answer pair which may be useful for you:
Q. In a fixed-point application with two decimal places, some inputs have many places and need to be rounded. Others are not supposed to have excess digits and need to be validated. What methods should be used?
A. The quantize() method rounds to a fixed number of decimal places. If the Inexact trap is set, it is also useful for validation:
>>> TWOPLACES = Decimal(10) ** -2 # same as Decimal('0.01')
>>> # Round to two places
>>> Decimal('3.214').quantize(TWOPLACES)
Decimal('3.21')
>>> # Validate that a number does not exceed two places
>>> Decimal('3.21').quantize(TWOPLACES, context=Context(traps=[Inexact]))
Decimal('3.21')
>>> Decimal('3.214').quantize(TWOPLACES, context=Context(traps=[Inexact]))
Traceback (most recent call last):
...
Inexact: None
The next question reads
Q. Once I have valid two place inputs, how do I maintain that invariant throughout an application?
If you need the answer to that (along with lots of other useful information), see the aforementioned section of the docs. Also, if you keep your Decimal
s with two digits of precision beyond the decimal point (meaning as much precision as is necessary to keep all digits to the left of the decimal point and two to the right of it and no more...), then converting them to strings with str
will work fine:
str(Decimal('10'))
# -> '10'
str(Decimal('10.00'))
# -> '10.00'
str(Decimal('10.000'))
# -> '10.000'
How to print a float with 2 decimal places in Java?
You can use the printf
method, like so:
System.out.printf("%.2f", val);
In short, the %.2f
syntax tells Java to return your variable (val
) with 2 decimal places (.2
) in decimal representation of a floating-point number (f
) from the start of the format specifier (%
).
There are other conversion characters you can use besides f
:
d
: decimal integero
: octal integere
: floating-point in scientific notation
HTML5 Number Input - Always show 2 decimal places
Solved following the suggestions and adding a piece of jQuery to force the format on integers:
parseFloat($(this).val()).toFixed(2)
Format number to 2 decimal places
You want to use the TRUNCATE
command.
https://dev.mysql.com/doc/refman/8.0/en/mathematical-functions.html#function_truncate
Amount to always show 2 decimal places
var amount = +"100";
$('#subpaymentbalance').val(amount.toFixed(2));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="subpaymentbalance" />
Make an html number input always display 2 decimal places
So if someone else stumbles upon this here is a JavaScript solution to this problem:
Step 1: Hook your HTML number input box to an onchange
event
myHTMLNumberInput.onchange = setTwoNumberDecimal;
or in the html code if you so prefer
<input type="number" onchange="setTwoNumberDecimal" min="0" max="10" step="0.25" value="0.00" />
Step 2: Write the setTwoDecimalPlace method
function setTwoNumberDecimal(event) {
this.value = parseFloat(this.value).toFixed(2);
}
By changing the '2' in toFixed
you can get more or less decimal places if you so prefer.
Using String Format to show decimal up to 2 places or simple integer
An inelegant way would be:
var my = DoFormat(123.0);
With DoFormat
being something like:
public static string DoFormat( double myNumber )
{
var s = string.Format("{0:0.00}", myNumber);
if ( s.EndsWith("00") )
{
return ((int)myNumber).ToString();
}
else
{
return s;
}
}
Not elegant but working for me in similar situations in some projects.
Related Topics
Generating Random Whole Numbers in JavaScript in a Specific Range
How to Debug My JavaScript Code
Get Difference Between 2 Dates in JavaScript
How to Split a String, Breaking At a Particular Character
Loading Cross-Domain Endpoint With Ajax
How to Use Formdata For Ajax File Upload
What Does the Construct X = X || Y Mean
Map Function For Objects (Instead of Arrays)
Enter Data into a Custom-Handled Input Field
Does JavaScript Have a Method Like "Range()" to Generate a Range Within the Supplied Bounds
Use of 'Prototype' Vs. 'This' in JavaScript
When Is JavaScript'S Eval() Not Evil
Why Is the Method Executed Immediately When I Use Settimeout
Benefits of Using 'Object.Create' For Inheritance
JavaScript or (||) Variable Assignment Explanation