struts2 jquery 插件实现ajax异步请求(网上资料)

技术2022-05-19 18

2，为Struts2安装JSON插件

JSON插件提供了一种名为json的ResultType，一旦为某个Action指定了一个类型为json的Result，则该Result无需映射到任何视图资源。因为JSON插件会负责将Action里的状态信息序列化成JSON格式的数据，并将该数据返回给客户端页面的JavaScript。简单地说，JSON插件允许我们在JavaScript中异步调用Action，而且Action不再需要使用视图资源来显示该Action里的状态信息，而是由JSON插件负责将Action里的状态信息返回给调用页面----通过这种方式，就可以完成Ajax交互。

完装JSON插件也只需将JSON的jar包复制到工程的WEB-INF/lib目录下。

JSON的下载地址是：http://www.json.org/ 我们下载Java1.5版本的JSON的lib包就可以了。

JSON的Struts2插件下载地址是：http://code.google.com/p/jsonplugin/downloads/list

将下载的文件json-lib-2.2.2-jdk15.jar和jsonplugin-0.30.jar复制到WEB-INF/lib目录下。

3，实现Action逻辑

下面以一个例子来实现JSON的调用：

1，JSP页面代码：

<%@ page language="java" contentType="text/html; charset=GBK"%><script src="prototype-1.4.0.js" type="text/javascript"></script><script language="JavaScript">function gotClick(){ //请求的地址var url = 'JSONExample.action'; //将favorite表单域的值转换为请求参数 var params = Form.serialize('form1'); //创建Ajax.Request对象，对应于发送请求 var myAjax = new Ajax.Request( url, { //请求方式：POST method:'post', //请求参数 parameters:params, //指定回调函数 onComplete: processResponse, //是否异步发送请求 asynchronous:true });}

function processResponse(request){ $("show").innerHTML = request.responseText;} </script><html><head><title>使用JSON插件</title></head><body><form id="form1" name="form1" method="post"><INPUT TYPE="text" name="field1" id="field1"/><br><INPUT TYPE="text" name="field2" id="field2"/><br><INPUT TYPE="text" name="field3" id="field3"/><br><INPUT TYPE="button" value="提交" onClick="gotClick();"/></form><div id="show"></div></body></html>

以上JSP页面有三个表单域，提交表单后通过异步方式发送给JSONExample.action处理。并将返回的数据放在名为show的div标签中。

2，Action中的代码如下：

package lee;import java.util.HashMap;import java.util.Map;import com.opensymphony.xwork2.Action;import com.googlecode.jsonplugin.annotations.JSON;public class JSONExample{ private int[] ints = {10, 20}; private Map map = new HashMap(); private String customName = "custom"; private String field1; //'transient'不会被序列化 private transient String field2; //没有setter和getter方法的字段不会被序列化 private String field3;

public String execute(){ map.put("name", "annlee"); return Action.SUCCESS; }

public String getField1() { return field1; } public void setField1(String field1) { this.field1 = field1; } public String getField2() { return field2; } public void setField2(String field2) { this.field2 = field2; } public String getField3() { return field3; } public void setField3(String field3) { this.field3 = field3; } public int[] getInts() { return ints; } public void setInts(int[] ints) { this.ints = ints; } public Map getMap() { return map; } public void setMap(Map map) { this.map = map; } @JSON(name="newName") public String getCustomName() { return this.customName; }}

通过Action中的注释，可以了解到标记为'transient'的属性，以及没有get/set方法的属性不会被序列化，即不会出现在JSON的返回值中。

我们还可以通过@JSON注释来设置JSON返回值中的数据名称。此外JSON注释还支持如下几个域：

serialize:设置是否序列化该属性deserialize:设置是否反序列化该属性format:设置用于格式化输出,解析日期表单域的格式.例如"yyyy-MM-dd'T'HH:mm:ss"

3，struts.xml配置文件中的配置如下：

可以看到type=json的result无任何返回视图。这里还有另外两点要注意：1，struts.i18n.encoding要配置成UTF-8，国为Ajax的POST请求都是以UTF-8的方式进行编码的。2，配置包时，要扩展自json-default，因为在json-default包下才有json类型的result。

当然我们也可以按照普通的返回视图来实现这个功能，这就要在返回的JSP页面中将Action中需要返回的值从新做个包装。这种处理方式，我在另一篇文章中已经写过了。(http://hi.baidu.com/annleecn/blog/item/b0dc017a8ae897f10bd18755.html)

在上面的页面中使用了prototype.js的Ajax.Request来完成Ajax交互，为了使用prototype.js，需要在该页面中导入prototype.js的代码库。即将prototype.js放在JSP相同的目录下。或JSP可以访问到的目录下。

4，显示结果：

访问JSP页面，提交后的JSON返回结果如下：

{"newName":"custom","field1":"","field2":"","field3":"","ints":[10,20],"map":{"name":"annlee"}}

5，解析返回值：

对于上面的这种JSON格式的字符串，可以借助于JSON扩展后的字符串方法将转换成一个对象，从而能以更简单的方式来访问该字符串，JSON扩展了JavaScript字符串的方法，为JavaScript字符串增加了一个parseJSON()或parse()方法，该方法用于将一个JSON格式的字符串解析成一个个JSON对象，例子代码如下：

当然，这里也要将json.js放在同JSP一样的目录下。或JSP可以访问到的目录下。

--说明：此文章来自网上搜索

专利

最新回复(0)