Step1: Install and Configure Maven

We use Maven to describe this software project and to manage the dependencies.

1.) Download maven from http://maven.apache.org/download.html and extract it.

2.) Add MAVEN_HOME/bin to your PATH

Step2: Create your Struts2 Project

1.) Switch to your Eclipse Workspace.

cd workspace

2.) Create the Project based on the struts2-archetype-convention archetype.

mvn archetype:generate -B -DgroupId=com.jgeppert.examples -DartifactId=struts2-example -DarchetypeGroupId=org.apache.struts -DarchetypeArtifactId=struts2-archetype-convention -DarchetypeVersion=2.3.8

3.) Wait until maven download the whole Internet except Cats Pictures and Porn.

4.) Go into the new created folder struts2-example

cd struts2-example

5.) Open pom.xml in an Editor

6.) Set your project version to 0.0.1

    <version>0.0.1</version>

7.) Set your Struts2 Version to 2.3.8

    <properties>
        <struts2.version>2.3.8</struts2.version>
    </properties>

8.) Build your blank application

mvn install

9.) Try it out

mvn jetty:run

10.) Open http://localhost:8080/struts2-example/ in your Browser

The Message "Struts is up and running..." should appear.

Step3: Create the Eclipse Project

1.) Open your Eclipse IDE

2.) Install m2-eclipse and restart your IDE.

3.) Open the Import Dialog in your Eclipse IDE and import your created Project "struts2-example".

Step4: Add the Struts2 jQuery Plugin to your Project

The Struts2 jQuery Plugin provides an easy Integration of jQuery into this Project.

1.) Open your pom.xml and edit your project properties.

    <properties>
        <struts2.version>2.3.8</struts2.version>
        <struts2jquery.version>3.5.0</struts2jquery.version>
    </properties>

2.) Add the Dependencies

	<dependency>
		<groupId>com.jgeppert.struts2.jquery</groupId>
		<artifactId>struts2-jquery-plugin</artifactId>
		<version>${struts2jquery.version}</version>
	</dependency>

3.) Create a new Action YourNameAction.java inside of the com.jgeppert.examples.actions Package

package com.jgeppert.examples.actions;
 
import com.opensymphony.xwork2.ActionSupport;
 
public class YourNameAction extends ActionSupport {
 
    private String name;
 
    public String execute() throws Exception {
	if(name == null || name.length() < 3){
	    addActionError("Please enter valid name with more the 2 characters!");
	    return ERROR;
	}
 
        return SUCCESS;
    }
 
    public String getName() {
        return name;
    }
 
 
    public void setName(String name) {
        this.name = name;
    }
}

4.) Replace the Content of hello.jsp

<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<html>
<head>
    <title>My App</title>
    <sj:head jquerytheme="start"/>
    <style>
    	body {
    		font-family: Arial,sans-serif;
    		font-size: 9pt;
    	}
    </style>
</head>
 
<body>
	<h2>Please enter a Name</h2>
 
	<s:form action="your-name" theme="xhtml">
		<s:textfield name="name" label="Enter your Name"/>
		<sj:submit 
			targets="result" 
			effect="highlight" 
			value="Submit" 
			button="true"
		/>
	</s:form>
 
	<h3>AJAX Result</h3>
	<div id="result"></div>
</body>
</html>

5.) Create a new JSP inside of your WEB-INF/content folder called your-name.jsp

<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<h4>Welcome <s:property value="name"/>!</h4>

6.) Create a new JSP inside of your WEB-INF/content folder called your-name-error.jsp

<%@ page contentType="text/html; charset=UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<s:actionerror theme="jquery"/>

7.) Run "mvn install" and "mvn jetty:run"

8.) Open http://localhost:8080/struts2-example/ in your Browser and our created form should be appear.

9.) Submit without enter a Name. The Error Message should be visible inside of our defined Target Div without reloading the whole Page.

10.) Submit you form with an valid name.

Download the Sample Project Sources.