Struts2 + jquery
废话不多说,直接示例:
首先当然要搭建好struts2的开发环境,为了使用json数据格式,要导入struts2的一个json插件包,
我用的是struts2.1.8其解压后的在解压文件的lib目录下可找到这个json插件包struts2-json-plugin-2.1.8.1.jar
我的目录结构
src--
|---com.sun.jsondemo(package)
||----JsonPluginAction.java
|---struts.xmlWebRoot--
|---js(folder)
||----jquery-1.4.js
|---WEB-INF
|----lib(项目所需jar包)
|----page
|---book.jspJsonPluginAction.java:
packagecom.sun.jsondemo;
importjava.util.ArrayList;
importjava.util.List;
importorg.apache.struts2.json.annotations.JSON;
importcom.opensymphony.xwork2.ActionSupport;
publicclassJsonPluginActionextendsActionSupport{
/**
*
*/privatestaticfinallongserialVersionUID=1L;
privateintbookid;
privateStringtitle;
privatedoubleprice;
privateList<String>comments;//secret1和secret2没有提供setter和getter方法,不会返回为json格式
privatetransientStringsecret1;//这个关键字表示这个field不会持久化
privateStringsecret2;@JSON(name="ISBN")//可以通过注解方式改变json对象中属性的名称
publicintgetBookid(){returnbookid;}
publicvoidsetBookid(intbookid){this.bookid=bookid;}
publicStringgetTitle(){returntitle;}
publicvoidsetTitle(Stringtitle){this.title=title;}
publicdoublegetPrice(){returnprice;}
publicvoidsetPrice(doubleprice){this.price=price;}
publicList<String>getComments(){returncomments;}
publicvoidsetComments(List<String>comments){this.comments=comments;}
@Override
//我们在这里简单的给定一些值,实际当然从页面动态获取
publicStringexecute()throwsException{
bookid=111111;
title="struts-json-jqueryintegration";
price=99;
comments=newArrayList<String>(3);
comments.add("It'snobad");
comments.add("WOW");
comments.add("Nocomment!");
secret1="Youcan'tseeme";
secret2="Iaminvisible";
returnSUCCESS;
}
}struts2.xml:
<struts><constantname="struts.enable.DynamicMethodInvocation"value="false"/><constantname="struts.devMode"value="true"/><constantname="struts.ui.theme"value="simple"></constant>
<!--json-default定义在struts2的json插件包中,它包括了struts-default--><packagename="demo"namespace="/jsondemo"extends="json-default"><actionname="JsonPlugin"class="com.sun.jsondemo.JsonPluginAction"><!--这里type为json,表示action中的属性将以json对象的格式输出-->
<resulttype="json"/></action><actionname="GetJsonData"><resulttype="dispatcher">/WEB-INF/page/book.jsp</result></action></package></struts>
如果我们到此为止,通过浏览器访问http://localhost:8080/struts2demo/jsondemo/JsonPlugin.action
浏览器则会提示下载文件把文件打开后里面就是json的数据格式
{"ISBN":111111,"comments":["It's no bad!","WOW!","No comment!"],"price":99,"title":"struts-json-jquery integration"}这样肯定是不能干活的,但是到这里也算是成功的一半了。下面来个book.jsp通过jquery中的$.getJSON()函数:
<html>
<head>
<title>MyJSP'global.jsp'startingpage</title>
<metahttp-equiv="pragma"content="no-cache">
<metahttp-equiv="cache-control"content="no-cache">
<metahttp-equiv="expires"content="0">
<scripttype="text/javascript"src="${pageContext.request.contextPath}/js/jquery-1.4.js"></script>
<scripttype="text/javascript">
$(document).ready(function(){
$("#showbook").click(function(){
varbasepath=$("#basepath").val();
vardetail=$("#detail");
$.getJSON(basepath+"/jsondemo/JsonPlugin.action",
{t:newDate()},
function(data){
varisbn=data.ISBN;
vartitle=data.title;
alert(title);
varprice=data.price;
detail.append("ISBN:"+isbn+"<br/>"+
"Title:"+title+"<br/>"+
"Price:"+price+"<br/>");
detail.append("Comments:"+"<br/>"+"<hr>"+"<br/>");
varcomments=data.comments;
for(vari=0;i<comments.length;i++){
detail.append("<p>"+"#"+(i+1)+""+comments[i]+"</p><br>");
}
});
});
});
</script>
</head>
<body>
<inputid="basepath"type="hidden"value="${pageContext.request.contextPath}">
<inputid="showbook"type="button"value="RetrieveBook">
<divid="detail"></div>
</body>
</html>
完成了,到这里我们通过http://localhost:8080/struts2demo/jsondemo/GetJsonData.action就可以访问到
book.jsp页面,点击button就能在页面上看到反回的数据,这里其实主要涉及到json数据的解析。我对jquery也刚刚
开始研究,所以这里写的js代码肯定不够优美....
呵呵,如果有不正确的地方请大家指出!