In this tutorial you will learn how to format currency using javascript. In javascript it is not difficult to format currency. By using examples given in this tutorial you can do these two things.
1) Insert commas between every third digit from right to left for numbers 1000 and greater. It will make numbers easier to read. The number 9,999,999.00 is easy to read as compare to 9999999.00
Input:-
1000.00
Output:-
1,000.00
2) Round numbers to the nearest hundredth, with two digits after the decimal point. It will help you when displaying the total price of the orders.
Input:-
9999.999
Output:-
10,000.00
1) Insert commas between every third digit from right to left for numbers 1000 and greater. It will make numbers easier to read. The number 9,999,999.00 is easy to read as compare to 9999999.00
Input:-
1000.00
Output:-
1,000.00
2) Round numbers to the nearest hundredth, with two digits after the decimal point. It will help you when displaying the total price of the orders.
Input:-
9999.999
Output:-
10,000.00
Let's have a look over the first example that will insert commas between every third digit from right to left for numbers 1000 and greater.
Format the currency using javascript
Format-currency-using-javascript.html
At the top of the function, the comma character is assigned to variable delimiter. That's the comma between the quotation marks. If you want to use a different delimiter, replace the comma character with the character of your choice.
The function splits the amount on the basis of decimal point. The digits after the decimal point are stored in variable d.
The number in front of the decimal point is the entire amount, stored as an integer in variable i. If i is not a valid number, the function returns a null value.
Negative numbers are handled similar to the currency conversion function.
After then three digits are excluded from the end of the number and assigned to array variable a, so long as the number is longer than three digits. The number is then reformed using array a elements, with the delimiter digit inserted between each element.
Finally, the decimal portion is appended to the number, minus sign put in front, if appropriate, and the number returned.
Now formattedAmount variable contains the formatted currency amount.
Note: - This function can only accept amount that contains the decimal point like 1000.00, if you will provide amount 1000(No decimal point) to this function then it will not format the amount.
For those who wish to provide input of amount without any decimal point such as 1000 then they can refer to the below example in which I further customized the CommaFormatted() function according to our need.
Now let's have a look over the second example that can round numbers to the nearest hundredth, with two digits after the decimal point. It will help you when displaying the total price of the orders.
The function CurrencyFormatted(amount) stores the amount in variable i as a floating decimal point number. It also uses parseFloat() in case the function is sent a string representing a number instead of number itself.
The next line checks the existence of valid number. If user sends function the value "hello world" would result in a non-number and as a response the function converts the non-number into "0.00", you can also prompt a message to the user to enter valid number.
After that, the function CurrencyFormatted(amount) determines whether the number is positive or negative, converts it to positive if necessary, and then rounds the number to the nearest hundredths.
Finally, it makes sure there are two digits following the decimal point and prepends the "-" character if it started as a negative number, and returns the result.
Now if user will provide the amount 9999.999 as an input then you will get 10,000.00 as an output.
So these are the examples to format the currency using javascript. I love your feedback.
Format the currency using javascript
Format-currency-using-javascript.html<html>
<head>
<title>Format currency using javascript</title>
<script language="javascript" type="text/javascript">
//Javascript function to perform currency formatting
function CommaFormatted(amount)
{
var delimiter = ","; // replace comma if desired
var a = amount.split('.',2)
var d = a[1];
var i = parseInt(a[0]);
if(isNaN(i)) { return ''; }
var minus = '';
if(i < 0) { minus = '-'; }
i = Math.abs(i);
var n = new String(i);
var a = [];
while(n.length > 3)
{
var nn = n.substr(n.length-3);
a.unshift(nn);
n = n.substr(0,n.length-3);
}
if(n.length > 0) { a.unshift(n); }
n = a.join(delimiter);
if(d.length < 1) { amount = n; }
else { amount = n + '.' + d; }
amount = minus + amount;
return amount;
}
var amount="1000.00";
var formattedAmount=CommaFormatted(amount);
alert(formattedAmount);
</script>
</head>
</html>
At the top of the function, the comma character is assigned to variable delimiter. That's the comma between the quotation marks. If you want to use a different delimiter, replace the comma character with the character of your choice.
The function splits the amount on the basis of decimal point. The digits after the decimal point are stored in variable d.
The number in front of the decimal point is the entire amount, stored as an integer in variable i. If i is not a valid number, the function returns a null value.
Negative numbers are handled similar to the currency conversion function.
After then three digits are excluded from the end of the number and assigned to array variable a, so long as the number is longer than three digits. The number is then reformed using array a elements, with the delimiter digit inserted between each element.
Finally, the decimal portion is appended to the number, minus sign put in front, if appropriate, and the number returned.
Now formattedAmount variable contains the formatted currency amount.
Note: - This function can only accept amount that contains the decimal point like 1000.00, if you will provide amount 1000(No decimal point) to this function then it will not format the amount.
For those who wish to provide input of amount without any decimal point such as 1000 then they can refer to the below example in which I further customized the CommaFormatted() function according to our need.
<html>
<head>
<title>How to format currency in javascript</title>
<script language="javascript" type="text/javascript">
//Javascript function to perform currency formatting
function CommaFormatted(amount)
{
var delimiter = ",";
var i = parseInt(amount);
if(isNaN(i)) { return ''; }
var minus = '';
if(i < 0) { minus = '-'; }
i = Math.abs(i);
var n = new String(i);
var a = [];
while(n.length > 3)
{
var nn = n.substr(n.length-3);
a.unshift(nn);
n = n.substr(0,n.length-3);
}
if(n.length > 0)
{
a.unshift(n);
}
n = a.join(delimiter);
amount = n;
amount = minus + amount;
return amount;
}
var amount="1000";
var formattedAmount=CommaFormatted(amount);
alert(formattedAmount);
</script>
</head>
</html>
Now let's have a look over the second example that can round numbers to the nearest hundredth, with two digits after the decimal point. It will help you when displaying the total price of the orders.
<html>
<head>
<title>
Format currency in javascript
</title>
<script language="javascript" type="text/javascript">
function CommaFormatted(amount)
{
var delimiter = ","; // replace comma if desired
var a = amount.split('.',2)
var d = a[1];
var i = parseInt(a[0]);
if(isNaN(i)) { return ''; }
var minus = '';
if(i < 0) { minus = '-'; }
i = Math.abs(i);
var n = new String(i);
var a = [];
while(n.length > 3)
{
var nn = n.substr(n.length-3);
a.unshift(nn);
n = n.substr(0,n.length-3);
}
if(n.length > 0) { a.unshift(n); }
n = a.join(delimiter);
if(d.length < 1) { amount = n; }
else { amount = n + '.' + d; }
amount = minus + amount;
return amount;
}
function CurrencyFormatted(amount)
{
var i = parseFloat(amount);
if(isNaN(i)) { i = 0.00; }
var minus = '';
if(i < 0) { minus = '-'; }
i = Math.abs(i);
i = parseInt((i + .005) * 100);
i = i / 100;
s = new String(i);
if(s.indexOf('.') < 0) { s += '.00'; }
if(s.indexOf('.') == (s.length - 2)) { s += '0'; }
s = minus + s;
return s;
}
var amount ="9999.999";
var formattedAmount = CommaFormatted(CurrencyFormatted(amount));
alert(formattedAmount);
</script>
</head>
</html>
The function CurrencyFormatted(amount) stores the amount in variable i as a floating decimal point number. It also uses parseFloat() in case the function is sent a string representing a number instead of number itself.
The next line checks the existence of valid number. If user sends function the value "hello world" would result in a non-number and as a response the function converts the non-number into "0.00", you can also prompt a message to the user to enter valid number.
After that, the function CurrencyFormatted(amount) determines whether the number is positive or negative, converts it to positive if necessary, and then rounds the number to the nearest hundredths.
Finally, it makes sure there are two digits following the decimal point and prepends the "-" character if it started as a negative number, and returns the result.
Now if user will provide the amount 9999.999 as an input then you will get 10,000.00 as an output.
So these are the examples to format the currency using javascript. I love your feedback.
0 comments:
Post a Comment