hi i'm cameron mckenzie at cameron mcnz on twitter and i wanted to show you how to use the struts
jquery plugin to do ajax calls in your enterprise web applications so starting off here the first
thing i need is a web project so i'm going to create a maven project in eclipse just make it a
simple web project and i'm going to put in the basic attributes here
i'll make my group id com dot mcnz my artifact id will be struts ajax jquery
and of course this is going to be a war file because we've got a web application here so i'll
click finish on that now as that kicks off i'm actually going to i'm going to copy and paste a
whole poem a whole set of dependencies from a pom file that that i've got on a web page here or my
github repository and these are all needed in order to get this struts jquery example to work
so here we are right in here don't worry about that red x there actually it's a white x and a red
background that's just saying we need a web.xml file i'll address that in just a moment but i'm
going to paste all of these dependencies in here and so just watch this as i said you can get these
from my github repository so the dependencies that i've got here i'm just going to format this very
very quickly obviously the struts core struts convention gives me access to annotations the
struts the java servlet api obviously gives me access to all of the good things that come from
the servlet api like my session and my request and response objects that's just a dependency
now this here is the apache struts jquery plug-in so this is the one that's going to make jquery
work and the jquery custom tags work there's a bunch of other dependencies that you can add from
this project for data grids and trees and other gui components but i'm just going to use the core
struts jquery library here it's also worth pointing out that i've also got a build directive
in here and that build directive is going to ensure that i'm compiling against 1.8 binaries
even though locally i think i've actually got jdk 11 installed so that's the maven file right
there now it is complaining that there's no web.xml file and while i am a big advocate
of config of zero configuration applications we do need a web.xml file in this case i'm
going to go to the web app folder create a new folder called web inf print pronounced with all
uppercase letters and then i'm going to create a new file called web.xml pronounced with all
lower case letters and just put in the required struts mapping and struts works with struts 2.5
with this struts filter we don't have the controller anymore we now have a filter which
i think is a much more sound design and of course with this url pattern it means everything that
comes into this particular project named struts ajax jquery is going to go through this filter
now that's just the basic setup and it's now time to get into developing all of our web resources
so i'm going to create a new file right off the bat and i'll call it ajax link it will be a new
file ajax link.jsp it is a java server page and being a java server page we should put some
page directives or taglib directives at the top i'll leave off the page directive for now if it
doesn't complain and it looks like it's not but i do have these directives that includes all the
struts tags and this is the jquery struts tags you notice the sj right there now whenever you create
a web page you're supposed to well it should be well-formed which means it starts off with html
and then you should have a head tag and then stuff inside of the head tag and then you've got a body
tag as well now one of the things you need to include if you are doing struts if you are doing
jquery using the jquery struts plugin you have to have the struts jquery element head
inside the head of this application so that is an absolute requirement
now i'm getting a little bit of feedback here i think that's just because i haven't
updated the maven project so make sure you do that uh update project that will download all
of the fire files that are associated with that palm.xml file i'm hoping that that little error
message there that it can't find sjhed will go away so let me do that little maven update project
and then after that see if i can do a run as maven install and i'm hoping after i do those couple of
things that error will go away but it's not going to stop me from going forward in the body here
what i need to do is i'm just going to create a basic struts link so there's nothing crazy
about this this is just a regular struts link it's not doesn't have anything to do with the
it doesn't have anything to do with the struts jquery apis all this does is creates a struts link
its variable is ajax link that's what it's named
it calls on the hello action and is it the hello action that i'm going to be doing i
think it's going to be the ajax hello action that i'm going to be doing here and it passes
one parameter called handle and it's just going to be my twitter handle at cameronmcnz
and now we will have an ajax link in the code you'll notice right here the next line is to
take this url which was defined with this variable ajax link by the way don't use id there if you use
id you'll get a compile error we no longer have id in strut's url since 2.3 i believe now here is the
struts jquery tag and notice this stretch jquery tag its id is link 1. that's fine it is going to
use the url defined in this link created up here right so this url is associated with this ajax or
the struts url that was created earlier and this is going to target the div named ajax results
and so this just creates a link on the page that says say hello to at cameron mcnz now what is this
ajax results here now that's going to be a div so what you do is you create a div on the page
and so this div is named ajax results right the target of the ajax call is ajax results initially
it's just going to say jquery struts ajax results goes here so that's just going to be what displays
initially so that you know the person using this application knows where the ajax response is going
to go but what's going to happen when someone clicks on this link is this is going to get
removed and new html is going to get put in there asynchronously it's all going to happen on the
same page so that's the target of the ajax call now that's really the whole kit and caboodle as
far as struts and jquery and ajax development goes but there are a couple of pieces of the puzzle
that need to be added we need to add this hello action and we also need to create the page that
is going to generate that results so i'm going to create that action class i'm going to come over to
my java resources here create a new class in the com.mcnz.struts package it's going to be called
the ajax hello action
and it's gonna well it's gonna have a couple of annotations on it
so it's an action class so i need to put the action annotation on it's going to call
the action is named ajax hello let's make sure it's the name that i used there yep ajax hello
and when this runs if we get a success indication we're going to send to the results.jsp file to
generate that html fragment now i haven't created that file yet but i will in a moment but first
things first i have to create the execute method which is where the logic for the action goes
i can just say hey print out the handle and then return the keyword success because it's
not a keyword but it's a string right if there's success we will send somebody to this page and so
that returns success causes that page to run of course it's barking because it says handle what
the heck are you talking about with handle and i'm like well handle this the property
right here that is getting submitted to the server when someone clicks on the url and the
struts action is saying yeah you haven't defined that as a property i'm like oh yeah i haven't done
that yet so i have to say private string handle and add in the requisite setters and getters
so the setters and getters are now added and so when this ajax link is clicked that ajax link
is clicked asynchronous asynchronously the value at cameron mcnz is going to be passed
as part of a name value pair where it says handle equals cameron mcnz
and that word handle will end up getting mapped to this struts action class right there and
that parameter handle through the setters and getters and that's why i can then say
handle right there now i am getting a little bit of clap back here notice results cannot be found
an action cannot be found that's because i have to organize my import so source organize imports
it's going to find that struts action right there and the result annotation as well
so i save that and those errors go away and i'd have to say this is looking like a
pretty handsome struts class now let me just make sure i haven't missed anything yet or i guess what
i have missed is this results jsp and so what's going to get shoved right in here when this runs
well i want to have a jsp that's going to say hey hello so i'm going to create a new jsp
results.js is it plural results yeah there's an s there as opposed to just result there
where there's no s so the result jsp it's going to have well in this case i'll just have the
regular struts tag up there you know it's a good idea always to have that page directive too so i
didn't have that in the original jsp but you know i'm going to throw it in there just because that
is convention just a good idea to have and now i don't need a full html page here i just need
a little bit of html because when you're working with ajax you only send back snippets of code so
i'm going to say hello and i'm going to print out the value of the handle using a struts tag
remember handle is this property here that's got initialized and it's initialized based on this
value at cameron mcnz which is a parameter to the link which is invoked asynchronously so i'll click
control s and save there what am i getting barked at the tag handler class for was not found on the
java build path well i'm pretty sure that it it was so i'm not going to worry too much about that
and now i'm going to make sure everything's saved i'm going to do a maven update project which is
always a good idea if you've played around with your pom file then maybe even do a maven clean
and then who knows even a run as maven installed just to generate everything
i know i'm being a little bit uh paranoid here but i just like to make everything
make sure everything is working and now the last thing to do is just run this
on the server so i'm going to run this on my tomcat server
and as this runs on the server you'll see this say hello to at cameron mcnz
that's the link that i created that's the spot where the ajax result will go when it comes in
i'll click on the link and notice it now says hello at cameronmcnz but it's actually the same
file that i started on it didn't actually forward to the results jsp file there
and that's just evidence of the fact that we now have a struts based ajax request response cycle
using the struts jquery plugin and there you go that's how easy it is to integrate
ajax into your applications with that jquery struts plug-in if you enjoyed this tutorial
once you head over to the serverside.com we've got lots of great tutorials on strut
spring hibernate anything to do with enterprise software development really if you're interested
in my personal antics you can follow me on twitter at cameronmcnz and subscribe on youtube