It is very hot question among the newbie. So here i am going to give example of partial page refresh using JQuery (AJAX) in Struts 2. Here i will refresh (or update) a div (id='leftDiv' with result.jsp ).
Let us consider you have a jsp page say test.jsp like this:
<%@taglib prefix="s" uri="/struts-tags" %>
<div id="leftDiv">
<s:include value="/pages/profile.jsp"></s:include>
</div>
<div>
<a href="#" id="idAnchor">Partial Refresh</a>
</div>
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$('#idAnchor').click(function(){
$.ajax({
url: 'getResultAction', // action to be perform
type: 'POST', //type of posting the data
data: { name: 'Jeetu', age: '24' }, // data to set to Action Class
dataType: 'html',
success: function (html) {
('#leftDiv').html(html); //set result.jsp output to leftDiv
},
error: function(xhr, ajaxOptions, thrownError){
alert('An error occurred! ' + thrownError);
},
});
});
})
</script>
Struts.xml
<package name="extype" extends="struts-default">
<action name="getResultAction" method="getInfo" class="com.jkit.TestAction">
<result name="success">/pages/result.jsp</result>
</action>
</package>
TestAction.java
public class TestAction {
private String name;
private String age;
public String getInfo(){
// your requirements go here
return "success";
}
public String getAge() {
return age;
}
public void setAge(String age) {
this.age = age;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
result.jsp
<%@taglib prefix="s" uri="/struts-tags" %>
<h1>Call getName() from TestAction.java</h1>
Name: <s:property value="name"/>
<h1>Call getAge() from TestAction.java</h1>
Age: <s:property value="age"/>
After the Ajax call result.jsp output will be setting to div with id="leftDiv". So partial page update or refresh can be done easily with the help of Jquery(AJAX).
Source code please:(
ReplyDeleteAlso where is the method getInfo in action class.
I can see that it is called from struts.xml file alone and not implemented.
Ya correct you can write getInfo method and can write logic according to your requirement.
ReplyDeleteThank you very much for your post, indeed helpful.
ReplyDeleteNevertheless, I would like to point out two corrections in your example. Please edit your example with these corrections, so that it will eventually save some time of whoever follow this post in coming days.
1. add method getInfo() in TestAction.java:
public String getInfo(){
// --- your requirements here ---
return "success";
}
2. In the ajax call given in test.jsp, correct the line as-
$('#leftDiv').html(html); //set result.jsp output to leftDiv
Thank you to point out two corrections in the example. I updated the same in the post. Thank you again to visit the site.
ReplyDeleteThanks ! It's something i was looking for and explained really well .
ReplyDeletein my case i couldn't get rid of
('#leftDiv').html(html); //set result.jsp output to leftDiv
then i tried using ('#leftDiv').load('result.jsp') and it works .
Thanks for tutorial, it is realy helpfull.
ReplyDeleteIf the page has a form with an element
ReplyDeletethen if the form is submitted then leftDiv also updated. How can I solve it?
input tyle="submit" elemetn
ReplyDeleteWhichever part(div) you want to refresh or update, same you do by following above approach just change the div id that it, form wont be a problem at all. If you have any doubt your most welcome.
ReplyDeleteWhere is the code of profile.jsp??
ReplyDeletethe one mentioned in test.jsp file
Not Working in Program kindly give me any file need to include
ReplyDelete