在Struts2中使用JSON AJAX

JSON插件提供了一种名为json的ResultType，一旦为某个Action指定了一个类型为json的Result，则该Result无需映射到任何视图资源。因为JSON插件会负责将Action里的状态信息序列化成JSON格式的数据，并将该数据返回给客户端页面的JavaScript。

　　简单地说，JSON插件允许我们在JavaScript中异步调用Action，而且Action不再需要使用视图资源来显示该Action里的状态信息，而是由JSON插件负责将Action里的状态信息返回给调用页面——通过这种方式，就可以完成Ajax交互。

　　Struts2提供了一种可插拔方式来管理插件，安装Struts2的JSON插件与安装普通插件并没有太大的区别，一样只需要将Struts2插件的JAR文件复制到Web应用的WEB-INF/lib路径下即可。

--------引用

JSON插件下载地址：JSON插件下载

框架结构为：struts2 jquery JSON

首先搭建struts2环境

然后引入jar包如下图：

还需引入jquery.js文件

整个项目结构图如下

配置struts.xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>

    <constant name="struts.enable.DynamicMethodInvocation" value="false" />
    <constant name="struts.devMode" value="false" />

    <package name="default" namespace="/" extends="json-default">
        <action name="loginAction" class="com.org.LoginAction">
           <result name="success" type="json"></result>
        </action>
    </package>

    <!-- Add packages here -->

</struts>

建立Action类 LoginAction.java

package com.org;

public class LoginAction {
	private String username; //用户名
	private String password; //密码
	private String realname; //真实姓名
	private String age;      //年龄
	private String address;  //地址


	public String getRealname() {
		return realname;
	}

	public void setRealname(String realname) {
		this.realname = realname;
	}
	public String getAge() {
		return age;
	}

	public void setAge(String age) {
		this.age = age;
	}

	public String getAddress() {
		return address;
	}

	public void setAddress(String address) {
		this.address = address;
	}

	public String getUsername() {
		return username;
	}

	public void setUsername(String username) {
		this.username = username;
	}

	public String getPassword() {
		return password;
	}

	public void setPassword(String password) {
		this.password = password;
	}

	
	public String execute() {
		
		//我很郁闷  不知道JSON是怎么从这个Action中得到的数据
		
		//LoginAction login = new LoginAction();
		
		/*login.setUsername(username);
		login.setPassword(password);
		login.setRealname(realname);
		login.setAddress(address);
		login.setAge(age);*/
		
		//JSONObject obj = JSONObject.fromObject(login);
		return "success";
	}
}

前台页面 login.jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page contentType="text/html; charset=utf-8"%>  <!-- 乱码 -->
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">

		<title>My JSP 'login.jsp' starting page</title>

		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <!-- 还是乱码 -->
		<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
	<script type="text/javascript" src="js/my.js"></script>

	</head>

	<body>
	<%
	   //竟然还是TMD乱码
	   response.setContentType("text/html;charset=utf-8");
	   request.setCharacterEncoding("utf-8");
	%>
	<div id="msg"></div>  <!-- 用于显示信息 -->
	<form action="" method="post">
		用户名：<input type="text" name="username" id="username"><br>
		密码: <input type="password" name="password" id="password"><br>
		真实姓名：<input type="text" name="name" id="realname"><br>
		年龄：<input type="text" name="age" id="age"><br>
		住址：<input type="text" name="address" id="address"><br>
		<input type="button" value="提交" id="btn" />
	</form>
	</body>
</html>

my.js

$(document).ready(function(){
	$("#btn").click(function(){
		var url = "loginAction";  //URL路径
		var username = $("#username").val();
		var password = $("#password").val();
		var realname = $("#realname").val();
		var age = $("#age").val();
		var address = $("#address").val();
		//参数
		var params = {"username":username,"password":password,"realname":realname,"age":age,"address":address};
		
		$.ajax({
			url:url,
			type:"post",
			dataType:"json",
			data:params,
			success:callBack  //回调函数
		})
	})
	function callBack(result){
		//为什么不是eval("("+result+")")  也郁闷中
		var json = eval(result);
		var str = "username:" + json.username + "<br />"; 
		str += "password:" + json.password + "<br />";
		str += "realname:" + json.realname + "<br />";
		str += "age:" + json.age + "<br />";
		str += "address:" + json.address + "<br />";
		
		$("#msg").html(str);
	}
})

备注：

在调试的时候出现了乱码，本人水平有限，解决不了。

在login.jsp中设置了

<%@ page contentType="text/html; charset=utf-8"%>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<%
//竟然还是TMD乱码
response.setContentType("text/html;charset=utf-8");
request.setCharacterEncoding("utf-8");
%>

最后在struts.xml中也配置了

<constant name="struts.i18n.encoding" value="UTF-8" />

还是乱码....

在struts.xml的配置文件中需要注意一点：

package继承的是json-default 而不是struts-default 这是因为只有在该包下才有JSON类型的Result

写到此处还是有点不明：

在my.js 中利用ajax请求地址到loginAction返回是JSON格式数据，不知道它是如何得到Action中的数据的。

我尝试把所有属性的set,get方法注释掉，发现得不到数据了，也许就是set,get传递数据的。

不解与不明之处还请指教！