Struts2 tiles integration

In this post, I am going to explain how to integrate Apache tiles with struts2.  Apache Tiles is a template composition framework, allow you to define page fragments, which can be assembled into a complete page at runtime.

In almost all web applications, many web pages share some common code like header, footer, and menu.  By using tiles we can define page fragments like header, footer, menu separately and assemble them at run time.

Step 1: Create new Dynamic web project “struts_tutorial”.

Select the check box “Generate web.xml Deployment descriptor” and press finish.

Step 2: Convert this project to maven project.

Right click on project, go to Configure -> Convert to Maven Project.

Step 3: Update pom.xml for maven dependencies.

pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>struts_tutorial</groupId>
  <artifactId>struts_tutorial</artifactId>
  <version>0.0.1-SNAPSHOT</version>
  <packaging>war</packaging>
  <build>
    <sourceDirectory>src</sourceDirectory>
    <plugins>
      <plugin>
        <artifactId>maven-compiler-plugin</artifactId>
        <version>3.1</version>
        <configuration>
          <source>1.6</source>
          <target>1.6</target>
        </configuration>
      </plugin>
      <plugin>
        <artifactId>maven-war-plugin</artifactId>
        <version>2.4</version>
        <configuration>
          <warSourceDirectory>WebContent</warSourceDirectory>
          <failOnMissingWebXml>false</failOnMissingWebXml>
        </configuration>
      </plugin>
    </plugins>
  </build>

  <dependencies>
    <dependency>
      <groupId>org.apache.struts</groupId>
      <artifactId>struts2-core</artifactId>
      <version>2.3.20</version>
    </dependency>
    <dependency>
      <groupId>org.apache.struts</groupId>
      <artifactId>struts2-tiles-plugin</artifactId>
      <version>2.3.20</version>
    </dependency>

  </dependencies>
</project>

Step 4: Update web.xml like following. Provide entry of listener class Struts2TilesListener in the web.xml file. Listener used to automatically inject ServletContext init parameters so that they don't need to be configured explicitly for tiles integration.

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
  <display-name>struts_tutorial</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  
    <display-name>Struts2 Demo App</display-name>
    <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>
    
    <listener>
      <listener-class>org.apache.struts2.tiles.StrutsTilesListener</listener-class>
  </listener>
  
  <context-param>
    <param-name>tilesDefinitions</param-name>
    <param-value>/WEB-INF/tiles.xml</param-value>
  </context-param>
</web-app>

Step 5: It is time to create struts.xml. Since Struts 2 requires struts.xml to be present in classes folder. So create struts.xml file under the WebContent/WEB-INF/classes folder. Eclipse does not create the "classes" folder by default, so you need to do this yourself. To do this, right click on the WEB-INF folder in the project explorer and select New > Folder.

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="hello" class="learn.struts.HelloWorldAction">
      <result name="hello" type="tiles">template</result>
    </action>
  </package>
</struts>

Step 6: Create the tiles.xml file inside the WEB-INF folder and define all the tiles definitions.

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="template" template="/template.jsp">
    <put-attribute name="header" value="/header.jsp" />
    <put-attribute name="menu" value="/menu.jsp" />
    <put-attribute name="body" value="/body.jsp" />
    <put-attribute name="footer" value="/footer.jsp" />
  </definition>
</tiles-definitions>

Step 7: Create action class HelloWorldAction.java inside the package learn.struts.

package learn.struts;

public class HelloWorldAction {

  public String execute() {
    return "hello";
  }
}

Step 8: Create following jsp files.

body.jsp

<div>
  <h1>page body section</h1>
</div>

footer.jsp

<div>
  <h1>page footer section</h1>
</div>

header.jsp

<div>
  <h1>page header section</h1>
</div>

menu.jsp

<div>
  <h1>
    <ul>
      <li>Menu item 1</li>
      <li>Menu item 2</li>
      <li>Menu item 3</li>
      <li>Menu item 4</li>
      <li>Menu item 5</li>
      <li>Menu item 6</li>
    </ul>
  </h1>
</div>

template.jsp

<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<html>
<head>
<title>sample template</title>
<style>
body {background-color:lightgray}
h1   {color:blue}
</style>
</head>
<body style="width: 100%; height: 100%">
  <table border="1" style="width: 100%; height: 100%">
    <tr>
      <td colspan="2"><tiles:insertAttribute name="header" /></td>
    </tr>
    <tr>
      <td><tiles:insertAttribute name="menu" /></td>
      <td><tiles:insertAttribute name="body" /></td>
    </tr>
    <tr>
      <td colspan="2"><tiles:insertAttribute name="footer" /></td>
    </tr>
  </table>
</body>
</html>

index.jsp

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>Simple struts2 Application</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  </head>
  <body>
      <form method="post" action="hello">
          <input type="submit" value="submit" />
      </form>
  </body>
</html>

Step 7: Run the Application. Before running makes sure that your Application structure looks like following.

Once you deployed the application, it opens index.jsp like following.

Press submit button.

Prevoius                                                 Next                                                 Home