JavaScript Number Format v1.5.4

A custom JavaScript object to format numbers

Includes currency, commas, and decimal precision

Overview

NumberFormat is a custom object that I created that allows numbers to be formatted. Features include negative, currency, and percentage formatting; configurable digit grouping separators and decimal symbols; and certain decimal precision that leave trailing zeros. The input can be a string that's already formatted.

Download It

Public Domain

NumberFormat154.js (10 KB)

Using the .js file

JavaScript

<script type="text/javascript" src="numberFormat154.js"></script>
<script type="text/javascript">
<!--
function tryNumberFormat(obj)
{
	obj.value = new NumberFormat(obj.value).toFormatted();
}
//-->
</script>

HTML

<form>
<input type="text" name="txtTryIt" />
<input type="button" value="Try It"
 onclick="tryNumberFormat(this.form.txtTryIt);" />
</form>

Examples

The following is a simple example using the defaults. The default for input: a period decimal place (if not a whole number) and for output: comma separators, period decimal place, and precision of two places.

var num = new NumberFormat(10901.375).toFormatted();
// num will equal 10,901.38

The following is a multi-step example, in which separators are turned off (no commas), and decimal places are set to 3.

var nf = new NumberFormat(8563.04578);
nf.setPlaces(3);
nf.setSeparators(false);
var num = nf.toFormatted();
// num will equal 8563.046

NumberFormat 1.5.4 was tested in Windows 2000 using Firefox 1.0.6, Mozilla 1.7.7, Internet Explorer 6.0, Opera 8.0, Netscape 7.1, Netscape 6.1, and Netscape 4.74. Netscape 4.74 has one known problem where it doesn't give leading zeros (e.g. 0.1 versus .1)

Known browsers in which NumberFormat will not work: Netscape 2.02, Netscape 3.04

Interactive Example

Try out NumberFormat with an interactive example where you can choose available settings and view the results. It also generates the necessary code to run the example.

Learn more

API

Syntax information

Release Notes

Number Format v1.5.4

Released 24-August-2005
New feature - Option in setPlaces to truncate instead of round. Bug fix - Fixed it so setSeparators can be called with false and still have the output decimal set. Starting with 1.5.4, only a non-commented script has been released (to reduce the file size).

Number Format v1.5.3

Released 29-September-2004
Between NumberFormat 1.5.1 and 1.5.2, I accidently took out the logic that checks for this.hasSeparators, so I fixed that bug. This meant setting setSeparators or setCommas to false didn't do anything.

Number Format v1.5.2

Released 27-August-2004
Bug fixes and general code cleanup.
Took out deprecated RegExp.leftContext and RegExp.rightContext. Now using the array returned when calling exec on the RegExp instance. Refer to moveDecimalAsStringNF and justNumberNF.
Took out the HTML <!-- and //-->
Added addSeparators method.
Now able to accept the string 10E+3 and make it 10000 In 1.5.1 10e+3 as a number or string is ok and 10E+3 as a number is ok but in 1.5.1 when 10E+3 is passed in as a string, it turns out as 10

Number Format v1.5.1

Released 13-February-2004
Bug fixes. The major change was to work around floating point arithmetic errors. NumberFormat was affected by this in the getRounded function.
e.g. Multiply 162.3 by 100 and JavaScript returns 16230.000000000002
The methods that were modified: getRounded, setPlaces, justNumber, and the constructor. The methods that were added: expandExponential, moveDecimalRight, moveDecimalLeft, moveDecimalAsString, and moveDecimal.
Thanks to Paul for feedback on the rounding error, and Lakshmi for the suggestion to be able to format 20+ digit numbers.
For more information about the JavaScript math error, refer to this external web page: Problems with floating-point

Number Format v1.5.0

Released 20-December-2002
Several features were added. This includes: formatting for the digit grouping separator and decimal, negative formatting, flexible input parsing, and percentage formatting. Thanks to Gary McCool for suggesting the negative formatting and percentage formatting. Also, thanks to Morten for suggesting the variable separator and decimal, which should allow for various international styles of formatting.
In a future version, may want to log errors in a variable, that people could use to debug.

Number Format v1.0.3

Released 23-March-2002
After it checks for a formatted number, the setNumber method now replaces non-number values and infinite numbers with 0.
Thanks to Gary Deskin for suggesting that the formatted result should not return NaN.

Number Format v1.0.2

Released 13-March-2002
The constructor and the setNumber method can take a formatted string as an input. It parses the string into a number.
Thanks to Barnabas Kendall for the suggestion and for starting me off with the regular expression.

Number Format v1.0.1

Released 20-July-2001
Fixed a bug where a number like -123 would be formatted -,123 when commas were set to true.
Thanks to Stefan Els for pointing this out to me.

Number Format v1.0

Released 13-April-2000
Old version with bug.