Integrating Apache Tiles 2.2.x with a simple JSP application

This is a mini “how to” to integrate apache tiles 2.2.x into a simple web application using JSPs, it shows how to define a sample template and add two pages using it, the reason of making this tutorial is that I spent 2 days searching the Internet for something similar but I didn’t get any.
I’m just starting to learn tiles so there won’t be any deep information explaining it, you can refer to apache website for more details, I’ll try to make the tutorial practical and to the point, now let’s get started.


If you just want to view the code skip to “Just the code” section.

I’ve created a dynamic web project using eclipse, in the web.xml I added definition for the tiles servlet, tiles 2.2 provides a default servlet (SimpleTilesInitializerServlet) implementing the abstract tiles servlet, every tiles application should implement this servlet or implement a listener, the servlet takes a parameter referring to the tiles definitions file which refers to the defined pages and templates in the application.

Tiles definition contains definitions for the views in the application, each definition provides the values that will be injected in the view, definitions can extend each other, we have only one attribute in our example “body” which will refer to the jsp containing the body of the view.
the “template” definition sets an empty body, “search” sets search_body.jsp and “results” sets results_body.jsp.

The template files contains html code used for layout and uses <tiles:insertAttribute> tag to indicate the location in the page and name of a certain property that will be injected in the template, here we inject the “body” attribute and each view definition in tiles.xml will put it’s correspondant body jsp in the “body” attribute, search.jsp and results.jsp are just used to call the view definition in tiles.xml as I still didn’t figure is it possible to call the definitions directry with out those jsps like (http://app/search) for example.

Just the code

1- structure for the project

./WebContent/pages:
results_body.jsp results.jsp search_body.jsp search.jsp template.jsp

./WebContent/WEB-INF:
lib tiles.xml web.xml

./WebContent/WEB-INF/lib:
commons-beanutils-1.8.0.jar tiles-jsp-2.2.2.jar
commons-digester-2.0.jar slf4j-api-1.5.8.jar tiles-api-2.2.2.jar tiles-servlet-2.2.2.jar
jcl-over-slf4j-1.5.8.jar slf4j-jdk14-1.5.8.jar tiles-core-2.2.2.jar tiles-template-2.2.2.jar

2- Deployment descriptor

web.xml

1 <?xml version=”1.0″ encoding=”UTF-8″?>
2xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance&#8221;
3 xmlns=”http://java.sun.com/xml/ns/javaee&#8221; xmlns:web=”http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd&#8221;
4 xsi:schemaLocation=”http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd&#8221;
5 id=”WebApp_ID” version=”3.0″>
6 <display-name>application</display-name>
7 <welcome-file-list>
8 <welcome-file>index.html</welcome-file>
9 <welcome-file>index.htm</welcome-file>
10 <welcome-file>index.jsp</welcome-file>
11 <welcome-file>default.html</welcome-file>
12 <welcome-file>default.htm</welcome-file>
13 <welcome-file>default.jsp</welcome-file>
14 </welcome-file-list>
15
16
17 <servlet>
18 <servlet-name>tiles</servlet-name>
19 <servlet-class>org.apache.tiles.web.startup.simple.SimpleTilesInitializerServlet</servlet-class>
20
21 <init-param>
22 <param-name>org.apache.tiles.impl.BasicTilesContainer.DEFINITIONS_CONFIG</param-name>
23 <param-value>/WEB-INF/tiles.xml</param-value>
24 </init-param>
25 <load-on-startup>2</load-on-startup>
26 </servlet>
27 </web-app>

3- Tiles definitions file

tiles.xml

1 <?xml version=”1.0″ encoding=”UTF-8″?>
2 <!–DOCTYPE tiles-definitions PUBLIC
3 “-//Apache Software Foundation//DTD Tiles Configuration 2.0//EN”
4 “http://tiles.apache.org/dtds/tiles-config_2_0.dtd”&gt;
5
6 <tiles-definitions>
7 <definition name=”template” template=”/pages/template.jsp”>
8 <put-attribute name=”body” value=”” />
9 </definition>
10 <definition name=”search” extends=”template”>
11 <put-attribute name=”body” value=”/pages/search_body.jsp” />
12 </definition>
13 <definition name=”results” extends=”template”>
14 <put-attribute name=”body” value=”/pages/results_body.jsp” />
15 </definition>
16 </tiles-definitions>

4- The tiles template (main layout for the application)

template.jsp

1 <%@ taglib uri=”http://tiles.apache.org/tags-tiles&#8221; prefix=”tiles” %>
2 <html>
3 <head>
4 <title>Application Title</title>
5 </head>
6 <body>
7 <h1>Welcome to Application</h1>
8 <tiles:insertAttribute name=”body”/>
9 </body>
10 </html>

5 – search page

search.jsp

1 <%@ page language=”java” contentType=”text/html; charset=UTF-8″
2 pageEncoding=”UTF-8″%>
3 <!–DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”&gt;
4 <%@ taglib uri=”http://tiles.apache.org/tags-tiles&#8221; prefix=”tiles” %>
5 <tiles:insertDefinition name=”search”/>

search-body.jsp

1 <%@ page language=”java” contentType=”text/html; charset=UTF-8″
2 pageEncoding=”UTF-8″%>
3 <!–DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”&gt;
4
5 Search form here

6 – results page

results.jsp

1 <%@ page language=”java” contentType=”text/html; charset=UTF-8″
2 pageEncoding=”UTF-8″%>
3 <!–DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”&gt;
4 <%@ taglib uri=”http://tiles.apache.org/tags-tiles&#8221; prefix=”tiles” %>
5 <tiles:insertDefinition name=”results”/>

results_body.jsp

1 <%@ page language=”java” contentType=”text/html; charset=UTF-8″
2 pageEncoding=”UTF-8″%>
3 <!–DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”&gt;
4 View Results here

7 – urls

to access the search page http://app/pages/search.jsp , results: http://app/pages/results.jsp

That’s it and I hope that this tutorial can save time for future tiles beginners like me :D, if you have any questions or comments please let me know I check my blog frequently.

Leave a comment