JSF 2 Internationalization (i18n)

Prerequisites

Step 1 Create New Maven-based Dynamic Web Project

Step 1.1 Create New Project

Go to File->New->Others… Select Dynamic Web Project under Web category then click Next. Type JSF2Demo or whatever name you want in the Project name field.

Step 1.2 Configure Target Runtime

  • Click New Runtime… button under Target Runtime.
  • Select Apache Tomcat v7.0. Click Next.
  • Click Browse button to specify Tomcat Server installation directory. The select the folder then click Ok.
  • Click Installed JREs… button to add/remove or edit JRE definition. Remove existing one; then click Add button to configure new one. Select Standard VM; then click Next. Click Directory button to select the root folder of JDK installation. Select the folder then click Ok. Click Finish.
  • Check the JDK then click Ok.
  • Change JRE to the JDK then click Finish.
  • Click Finish the finish the project creation.

Step 1.3 Convert The Project To Maven Project

Right click to the project; select Configure->Convert to Maven Project. Eclipse will generate Project Object Model (pom.xml) file. Open the file by Eclipse text editor then paste the content below.

Note: you can create normal java project and add jar files to your project build path. But it’s easier & faster using maven as maven is integrated with Eclipse IDE; so you don’t need to manually install it. 

Step 2 Create Web Deployment Descriptor (web.xml)

You can create web.xml when creating project or do it later. Right click to the project; select Java EE Tools -> Generate Deployment Descriptor Stub to generate web.xml.

Step 3  Create Properties Files

  • Right click to the project or src folder; select New -> Package
  • Enter info.java.tips.i18n in Name field.
  • Click Finish.

Under the package, create 2 properties files by right click to the package; select New -> Other…; select File under General category.

Step 3.1 MessageBundle_en.properties

This file is used to contain English messages that’ll be displayed in xhtml pages.

Step 3.2 MessageBundle_fr.properties

This file is used to contain French messages that’ll be displayed in xhtml pages.

Step 3.3 MessageBundle_es.properties

This file is used to contain Spanish messages that’ll be displayed in xhtml pages.

Step 4 JSF configuration file

Create an empty XML file under WEB-INF folder and name it faces-config.xml . Paste the following content:

Step 5 Create JSF Managed Bean Class

Right click to the project or src folder; select New->Class.

Step 6 Create XHTML Pages

In this example we need 2 XHTML files. To create XHTML , simply follow the following steps:

  • Right click to the project or WebContent folder, select New -> HTML File from the menu.
  • Choose your file name then click Finish.
  • Eclipse IDE will generate some boilerplate code. We just clear all its content and replace with the following code:

Step 6.1 i18n.xhtml

Step 6.2 success.xhtml

Step 7 Clean & Build

Clean & build the project to clean old classes file (if any) & force the IDE to recompile java code.

  • Go to Project on menu bar; select Clean…
  • Select Clean all projects (default)
  • Click Ok to proceed clean & build.

Step 8 Configure Tomcat

Select Servers window; in case it’s not there, go to Windows -> Show View-> Others… Select Server -> Servers; then click Ok.

If this is the first time you are creating a server, in the Servers area you will see a link as No servers are available click this link to create a new server. Click the link.

Define a New Server window will be opened, In Select the server type. Select Apache -> Tomcat v7.0 Server. Then click Finish.

Step 9 Deploy The Application

  • Right click to the Tomcat Server select Add and Remove.
  • Move the application (JSF2Demo) from Available column to Configured. Then click on Finish to deploy it to tomcat server.

Step 10 Start Tomcat Server

Right click on the tomcat server and choose Start or simply click on the green start icon to start the server.

Step 11 Run The Application

We assume that you install tomcat on default port (8080) and project name is JSF2Demo. Open web browser and type:

http://localhost:8080/JSF2Demo/i18n.jsf

Output

A registration will be displayed. By default English will be loaded. Toggle language; enter your personal information then click Search button:

Let say I toggle Spanish( es):

Click Registro (register):