Tiles Result Example in Struts 2.2.1
Posted on: January 20, 2011 at 12:00 AM
Posted on: January 20, 2011 at 12:00 AM
Tiles Result Example
In Struts Tiles is a view layer which allows separate page to be reusable in single page.
To use tiles in your application you need to design a base layout which arranges the different views into single page. The base layout describes where to arrange the page by using <tiles:insertAttribute name="...." /> tag. The base layout for given example is as follows
baseLayout.jsp
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title><tiles:insertAttribute name="title" ignore="true" /></title> </head> <body> <table border="0" cellpadding="2" cellspacing="2" align="center"> <tr> <td height="30" colspan="2" BGCOLOR="pink"> <tiles:insertAttribute name="header" /> </td> </tr> <tr> <td height="350" width="150" BGCOLOR="lightblue"> <tiles:insertAttribute name="menu" /> </td> <td width="450" BGCOLOR="#CCFFCC"> <tiles:insertAttribute name="body" /> </td> </tr> <tr> <td height="30" colspan="2" BGCOLOR="pink"> <tiles:insertAttribute name="footer" /> </td> </tr> </table> </body> </html>
Now you need to design the pages which you have described in baseLaout.jsp such as header, footer, menu, body. And the pages which you have designed for your application.
header.jsp
<div align="center" style="font-weight:bold"> <font face="arier" size="6">Your Apps Header Goes Here</font> </div>
menu.jsp
<%@taglib uri="/struts-tags" prefix="s"%> <h3 align="center" color="red">Menu</h3> <ul><a href="<s:url action="hometilesAction"/>">Home</a><br></ul> <ul><a href="<s:url action="contacttilesAction"/>">Contact Us</a><br></ul> <ul><a href="<s:url action="aboutUstilesAction"/>">About Us</a><br></ul> <ul><a href="<s:url action="tutorialtilesAction"/>">Struts2.2.1 Tutorials</a><br></ul>
footer.jsp
<div align="center"> Your Apps Footer Goes Here </div>
body.jsp
<HTML> <BODY bgcolor="pink"> <p>body/content of the page</p> </BODY> </HTML>
aboutUs.jsp
<%@page contentType="text/html" pageEncoding="UTF-8"%> <center><h1>About Us Page</h1></center>
home.jsp
<%@page contentType="text/html" pageEncoding="UTF-8"%> <center> <h1>Home Page of your Apps</h1> <center>
contactUs.jsp
<h3><center>This is Contact Us Page</center></h3>
strutstutorial.jsp
<h3> <center> <a href="http://www.roseindia.net/struts/struts/struts2.2.1/index.html">Struts2.2.1 torials</a> </center> </h3>
Now you need the define the above basic pages(tiles) such as header, menu, footer, body And do mapping for all the pages of your application in a XML called tiles.xml
tiles.xml
<?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE tiles-definitions PUBLIC "-//Apache Software Foundation//DTD Tiles Configuration 2.0//EN" "http://tiles.apache.org/dtds/tiles-config_2_0.dtd"> <tiles-definitions> <definition name="baseLayout" template="/layouts/baseLayout.jsp"> <put-attribute name="title" value="Template"/> <put-attribute name="header" value="/layouts/header.jsp"/> <put-attribute name="menu" value="/layouts/menu.jsp"/> <put-attribute name="body" value="/layouts/bodyPart.jsp"/> <put-attribute name="footer" value="/layouts/footer.jsp"/> </definition> <definition name="home" extends="baseLayout"> <put-attribute name="title" value="Home"/> <put-attribute name="body" value="/pages/home.jsp"/> </definition> <definition name="aboutUs" extends="baseLayout"> <put-attribute name="title" value="AboutUs"/> <put-attribute name="body" value="/pages/aboutUs.jsp"/> </definition> <definition name="tutorial" extends="baseLayout"> <put-attribute name="title" value="StrutsTutorial"/> <put-attribute name="body" value="/pages/strutstutorial.jsp"/> </definition> <definition name="contact" extends="baseLayout"> <put-attribute name="title" value="contactUs"/> <put-attribute name="body" value="/pages/contactUs.jsp"/> </definition> </tiles-definitions>
Then you need to do some mapping in struts.xml as follows
struts.xml
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<package name="default" extends="struts-default">
<result-types>
<result-type name="tiles" class="org.apache.struts2.views.tiles.TilesResult"/>
</result-types>
<action name="*tilesAction" method="{1}" class="net.roseindia.TilesAction">
<result name="home" type="tiles">home</result>
<result name="aboutUs" type="tiles">aboutUs</result>
<result name="strutstutorial" type="tiles">tutorial</result>
<result name="contactUs" type="tiles">contact</result>
</action>
</package>
</struts>
To configure tiles integration you need to do some mapping for StrutsTilesListener. So you need to mapping as follows
web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app id="WebApp_9" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> <display-name>Struts Tiles Example</display-name> <listener> <listener-class>org.apache.struts2.tiles.StrutsTilesListener</listener-class> </listener> <filter> <filter-name>struts2</filter-name> <filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class> </filter> <filter-mapping> <filter-name>struts2</filter-name> <url-pattern>/*</url-pattern> </filter-mapping> <welcome-file-list> <welcome-file>index.html</welcome-file> </welcome-file-list> </web-app>
finally you need to write a Action which can handle all these
TilesAction.java
package net.roseindia;
import com.opensymphony.xwork2.ActionSupport;
public class TilesAction extends ActionSupport {
private static final long serialVersionUID = -2613425890762568273L;
public String home()
{
return "home";
}
public String aboutUs()
{
return "aboutUs";
}
public String tutorial()
{
return "strutstutorial";
}
public String contact()
{
return "contactUs";
}
@Override
public String execute() throws Exception {
// TODO Auto-generated method stub
return home();
}
}
When you run this application it will display message as shown below:
 |
 |
 |
 |
Tutorial Topics
Questions by Category