login

Subscribe to JSP Tutorial websiteRSS Feed
 » JSP Standard Tag Library » Formatting Number with fmt:formatNumber Action

Formatting Number with fmt:formatNumber Action

JSTL provides you the <fmt:formatNumber> to format number in different forms. If you remember, with the <c:out> action you can print any number such as integer or floating-point number. But with <fmt:formatNumber> you have more controls how number is formatted and printed. The most simple basic usage of the <fmt:formatNumber> action is as follows:

<fmt:formatNumber value="value" />

The <fmt:formatNumber> action accepts any number in the value attribute. It does more than the <c:out> action that it formats the number based on the locale which specify by the web browser setting in the client side or set by the web application in the server side. Let's take a look at an example of using <fmt:formatNumber>:

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core"
          prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt"
          prefix="fmt" %>

<html>
    <head>
        <title>format number</title>
    </head>
    <body>
        <c:set var="val" value="200.51" />
        <fmt:setLocale value="en_US"/>
        <fmt:formatNumber value="${val}" />

        <fmt:setLocale value="fr_FR"/>
        <fmt:formatNumber value="${val}" />
    </body>
</html>

In the above example, first we define a variable and set its value to 200.51. Then we  use action <fmt:setlocale> to override the locale of the browser. We set the locale to en_US so when we use the action <fmt:formatNumber> to format the number therefore it displays as 200.51 which is USA format. Next we set the locale to fr_FR and print the number again, now it displays as 200,51 which is France format.

Let's take a look at attributes of the <fmt:formatNumber> in more details:

Name Meaning
value Numeric value to be formatted.
type Determine the value is formatted as number, currency, or percentage.
pattern Specify a custom formatting pattern for the output.
currencyCode Only apply for the currency formatting which accepts ISO 4217 currency code.
currencySymbol Only apply for the currency formatting, accepts currency symbol
groupingUsed Used to define grouping separator for formated number
maxIntegerDigits Specify the maximum number of digits in the integer portion of the formatted number in the output.
minIntegerDigits Specify the minimum number of digits in the integer portion of the formatted number in the output.
maxFractionDigits Specify the maximum number of digits in the fractional portion of the formatted number in the output
minFractionDigits Specify the minimum number of digits in the fractional portion of the formatted number in the output.
var The variable name of the exported scoped variable
scope scope of the var variable

 Printing the percentage

Let's play with the printing percentage value.

<c:set var="val" value="20.51" />
<p> percentage in USA
<fmt:setLocale value="en_US"/>
<fmt:formatNumber value="${val}"
                  type="percent" />
</p>

In order to print the percentage format, you assign percent to the type attribute of the <fmt:formatNumber> action.

Printing different currency locale

To print currency, you assign currency to the type attribute and set the locale before outputting the formatted number.

<c:set var="val" value="40.52" />
<p> Currency in USA
<fmt:setLocale value="en_US"/>
<fmt:formatNumber value="${val}"
                  type="currency" />
</p>

<p>Currency in Germany
<fmt:setLocale value="de_DE"/>
<fmt:formatNumber value="${val}"
                  type="currency"/>
</p>
currency in USA $40.52 

currency in Germany 40,52 €

Printing number with a custom pattern

Sometimes, you'll need to print number with a specific custom pattern especially number in scientific notation. In these cases, you can define your own pattern and specify it in the pattern attribute of the <fmt:formatNumber> action. Let's take a look at an example of printing a big number with a scientific pattern:

<c:set var="val" value="46563746375" />
<fmt:formatNumber value="${val}"
                  pattern="###.###E0" />

If you run the above code you will see the number is formatted as the pattern which is 46.5637E9 .

There are a lot more cases you'll need to format number and output it on screen. You can refer to the attribute table above to find what you need and exercise with it to get more familiar with different kind number formatting.