Archive

Posts Tagged ‘Tiles’

Struts 1.3.5 Tiles – Basics

May 24, 2010 Leave a comment

Struts tiles provides us a templating system. The introduction below shows the basic reusability of the modules of a web page.
To start, we will build a basic struts project using a maven archetype. Read more of it here.
Add a new dependency to the pom file

 <dependency>
 <groupId>org.apache.struts</groupId>
 <artifactId>struts-tiles</artifactId>
 <version>1.3.5</version>
 </dependency>

In struts-config.xml of the project , add the following plugin

 <plug-in className="org.apache.struts.tiles.TilesPlugin" >
 <set-property property="definitions-config" value="/WEB-INF/tiles-defs.xml" />
 <set-property property="definitions-parser-validate" value="true" />
 <set-property property="moduleAware" value="true" />
 </plug-in>

What we will now do is remove the default welcome.jsp page that was created by maven and reroute the request to a page (layout.jsp) that we create using tiles.
The components of the page will be the following : header.jsp, footer.jsp,menu.jsp , body.jsp and need to be located in the pages folder.
These will look as follows:

header.jsp

<div id="header">
 This is header
</div>

footer.jsp

<div id="footer">
 This is footer
</div>

body.jsp

<div id="body">
 This is body
</div>

menu.jsp

<div id="menu">
 This is menu
</div>

layout.jsp

<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles"%>

<html:html>
<head>

</head>

<body>
<table>
<tr valign='top'><td style="background-color:LightSlateGray "><tiles:insert attribute="menu"/></td>
<td><table>
<tr><td style="background-color:LightSkyBlue"><tiles:insert attribute="header"/></td></tr>
<tr><td style="background-color:LightSteelBlue "><tiles:insert attribute="body"/></td></tr>
<tr><td style="background-color:LightSkyBlue"><tiles:insert attribute="footer"/></td></tr>
</table>
</td>
</tr>
</table>
</body>
</html:html>

Uncomment the following from web.xml

<init-param>
<param-name>chainConfig</param-name>
<param-value>org/apache/struts/tiles/chain-config.xml</param-value>
</init-param>

Create a file tiles-defs.xml in the webapp folder of the project with the following content

<?xml version="1.0" encoding="ISO-8859-1" ?>

<!DOCTYPE tiles-definitions PUBLIC
"-//Apache Software Foundation//DTD Tiles Configuration 1.1//EN"
"http://jakarta.apache.org/struts/dtds/tiles-config_1_3.dtd">
<tiles-definitions>
<definition name="Tiles.welcome" path="/pages/layout.jsp">
<put name="header" value="/pages/header.jsp" />
<put name="menu" value="/pages/menu.jsp" />
<put name="body" value="/pages/body.jsp" />
<put name="footer" value="/pages/footer.jsp" />
</definition>
</tiles-definitions>

So, now we have a tile definition by the name Tiles.welcome and the path /pages/layout.jsp. The layout.jsp has tiles header, menu, body and footer whose content will be in the files defined in the tiles-defs.xml file.

The last thing is to go to struts-config.xml file and change the forward path of the Welcome action…
Change ..

<action
path="/Welcome"
forward="/pages/Welcome.jsp"/>

to..

<action
path="/Welcome"
forward="Tiles.welcome"/>

Build and deploy the project. Go to the following url http://localhost:8080/test-struts-tiles (Note : The project I created was test-struts-tiles)
You should see the following

Note:
If you do not uncomment the lines in web.xml for chainConfig, you will get the following exception…
javax.servlet.ServletException: java.lang.IllegalArgumentException: Path Tiles.welcome does not start with a “/” character
org.apache.struts.chain.ComposableRequestProcessor.process(ComposableRequestProcessor.java:283)
org.apache.struts.action.ActionServlet.process(ActionServlet.java:1858)

<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib uri="http://struts.apache.org/tags-tiles" prefix="tiles"%>

<html:html>
<head>

</head>

<body>
<table>
<tr valign='top'><td style="background-color:LightSlateGray "><tiles:insert attribute="menu"/></td>
<td><table>
<tr><td style="background-color:LightSkyBlue"><tiles:insert attribute="header"/></td></tr>
<tr><td style="background-color:LightSteelBlue "><tiles:insert attribute="body"/></td></tr>
<tr><td style="background-color:LightSkyBlue"><tiles:insert attribute="footer"/></td></tr>
</table>
</td>
</tr>
</table>
</body>
</html:html>
Advertisements