Step1: Install and Configure Maven

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

1.) Download maven from https://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.5.5

3.) Wait until maven download the whole Internet except all the cat pictures 😉 .

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.) Be sure your Struts2 version in the pom.xml properties section is set to 2.5.5 or above.

    <properties>
        <struts2.version>2.5.5</struts2.version>
    </properties>

8.) Build your blank application.

mvn install

9.) With the integrated maven jetty plugin you can run your web application and 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. (Skip if you use another IDE or IDE with Maven build in support)

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

 

[YOUTUBE]1yOwMBYSq2A[/YOUTUBE]

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 to add the version of the Struts2 jQuery plugin.

<repositories>
    <repository>
        <id>sonatype.oss.snapshots</id>
        <name>Sonatype OSS Snapshot Repository</name>
        <url>http://oss.sonatype.org/content/repositories/snapshots</url>
        <releases>false</releases>
        <snapshots>true</snapshots>
    </repository>
</repositories>

<properties>
     <struts2.version>2.5.5</struts2.version>
     <struts2jquery.version>4.0.1-SNAPSHOT</struts2jquery.version>
</properties>

2.) Add the dependency for the Struts2 jQuery plugin

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

3.) Create a new Action Class YourNameAction.java inside 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"%>

<head>
    <title>My App</title>
    <sj:head jquerytheme="start"></sj:head>
    <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">
	</sj:submit></s:textfield></s:form>


<h3>AJAX Result</h3>

<div id="result"></div>

</body>

5.) Create a new JSP inside 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">!</s:property></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">
</s:actionerror></pre>

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 our defined target div without reloading the whole Page.

10.) Submit you form with a valid name.

Download the Sample Project Sources.

4 Easy Steps to create a Java based Web Application with Struts2 and jQuery
Tagged on:                     

20 thoughts on “4 Easy Steps to create a Java based Web Application with Struts2 and jQuery

  • 2011-06-24 at 06:30
    Permalink

    Hi thanks a lot the example works fine. One question this may be because I’m not familier with the maven, I couldn’t fing the struts.xml. I searched everywhere in the project folder including the location specified in the pom.xml (src/main/resources/struts.xml). Where is the struts.xml file?

    Reply
  • 2011-06-24 at 07:43
    Permalink

    This generated webapp is based on the Struts2 Convention Plugin. You only need a struts.xml if you like to overwrite the defaults or you like to set some configs. But it isn’t necessary.

    Reply
  • 2011-06-24 at 08:59
    Permalink

    Thanks.. It is little cnfusing to me because i’m not much familiar with annotations.

    Reply
  • 2011-10-30 at 21:07
    Permalink

    I like “showcase”
    but how do i validate form with modeldriven Action
    like authenticate user with database
    please reply
    thanks in advanced…

    Reply
  • 2011-12-16 at 06:06
    Permalink

    Curious on why you used YAML for your layout framework in your sample? Would you recommend using YAML for a web app using Struts2, your struts2-jquery and JSON?

    I tried working with jquery-ui-framework and it appears there are conflicts.

    thanks

    Reply
    • 2011-12-16 at 10:22
      Permalink

      In this Example I don’t use YAML. In the Struts2 jQuery Showcases I use it because I was to lazy to create the Styles for an CSS Colum Layout. 🙂

      What conflicts do you mean?

      Reply
  • 2012-03-13 at 16:07
    Permalink

    Thanks a lot. A very good example. It works with the first run under Tomacat 7, but it deosn’t work uder JBoss7.1. Do you have any idea why it doesn’t work with JBoss 7.1.

    Thanks.

    Reply
      • 2012-03-14 at 10:34
        Permalink

        Thank you so much for responding so quickly. In my case it is just a WARN. see below:
        WARN [com.opensymphony.xwork2.util.FileManager] (MSC service thread 1-1) Could not create JarEntryRevision for [vfs:/C:/esw/server/jboss-as-7.1.0.Final/standalone/deployments/struts2-example.war/WEB-INF/lib/struts2-json-plugin-2.3.1.2]!: java.io.FileNotFoundException: vfs:\C:\esw\server\jboss-as-7.1.0.Final\standalone\deployments\struts2-example.war\WEB-INF\lib\struts2-json-plugin-2.3.1.2 (Die Syntax für den Dateinamen, Verzeichnisnamen oder die Datenträgerbezeichnung ist falsch)

        Acctually I haven’t any problem with struts2 it works well. I would like to use struts2-Jquery-plugins in my application which is running under JBOSS 7. But when I test your example deployed on JBoss7.1 clicking on submit button nothing happens and any error occur. while it works well in tomcat7.

        Thank you.

        Reply
  • Pingback:Struts2 jQuery Plugin now based on jQuery 1.7 and with support for frozen Columns | Java, Programming, Struts2, jQuery, Linux and more

  • 2012-09-06 at 12:19
    Permalink

    I tried to run this example on JBOSS 7.1 and cannot get the name to show in the bottom part. From the log it looks like Struts cannot find “your-name” action.

    No configuration found for the specified action: ‘your-name’ in namespace: ‘/’. Form action defaulting to ‘action’ attribute’s literal value.

    I didn’t see any annotations on YourNameAction.java class.

    Please help!

    Thanks

    Reply
    • 2012-09-10 at 20:03
      Permalink

      Hi Natalia,

      are your sure your Struts2 App was started successfully? No errors during App start?

      Do you have used the struts2-archetype-convention archetype to generate the initials webapp project?

      Johannes

      Reply
  • 2012-12-17 at 13:08
    Permalink

    Wie sieht die struts.xml Datei aus, wenn man das struts-default überschreibt? Kriege das nicht hin, da ich noch andere actions benutze

    Reply
  • 2014-05-27 at 14:35
    Permalink

    hi,
    thanks for your support.
    I developed struts2 jquery plugin based application.
    It is working fine.
    After login application, it is working fine.
    But, if reload page by pressing f5, jquery is not defined error occurs. i.e., if i press f5, jquery js/css files are not loaded.

    what is going wrong.

    thanks for your solution.

    Reply
  • Pingback:How to create web applications with AngularJS and Struts2 | Java, Programming, Struts2, jQuery, Linux and more

  • Pingback:Struts with JQuery Tutorial | Struts

Leave a Reply to JoelCancel reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.