Struts2结合jquery使用Ajax传递Json数据

来源:互联网 发布:linux vi如何编辑 编辑:程序博客网 时间:2024/05/16 06:55
1.所需jar包
struts2的jar包:freemarker.jar  ognl.jar  struts2-core.jar  commons-logging.jar 
commons-fileupload.jar  commons-io.jar   xwork-core-2.1.6.jar
json的jar包:json-lib.jar  这个是json所需jar包
struts-json-plugin.jar这个是struts把json看作为插件为json提供的一个插件包
ezmorph.jar 使用json时要依赖的jar文件,在使用jquery的json时,没有引用该文件的时候容易报错。
commons-collections.jar  commons-lang.jar  commons-beanutils.jar  
因为json大量引用了Apache commons的包,所以这里要一并加入

2.web.xml
<?xml version="1.0" encoding="UTF-8"?><web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"><filter><filter-name>struts2</filter-name><filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class></filter><filter-mapping><filter-name>struts2</filter-name><url-pattern>/*</url-pattern></filter-mapping>  <welcome-file-list>    <welcome-file>index.jsp</welcome-file>  </welcome-file-list></web-app>

3.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><package name="ajax" extends="json-default"><action name="ajaxLogin" class="com.edifier.action.AjaxLoginAction"><!-- 返回类型为json 在sjon-default中定义 --><result type="json"><!-- root的值对应要返回的值的属性 --><!-- 这里的result值即是 对应action中的 result --><param name="root">result</param></result></action></package></struts>

4.index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script type="text/javascript" src="js/jquery-1.9.1.min.js"></script><script type="text/javascript">$(document).ready( function() {//使用 Ajax 的方式 判断登录$("#btn_login").click( function() {var url = 'ajaxLogin.action';var params=$("input").serialize();$.ajax({            url: url,            // 数据发送方式            type: "post",            // 接受数据格式            dataType : "json",            // 要传递的数据            data : params,            // 回调函数,接受服务器端返回给客户端的值,即result值            success :function cbf(data){//服务器返回后执行的函数 参数 data保存的就是服务器发送到客户端的数据var member = eval("("+data+")");//包数据解析为json 格式  $('#result').html("欢迎您:  "+member.map.name);}        });});});</script><!-- --></head><body><span>用户名:</span><input type="text" id="loginName" name="user.loginName"><br /><span>密码:</span><input type="password" name="user.password" id="password"><br /><input type="button" id="btn_login" value="Login" /><p>这里显示ajax信息:<br /><span id="result"></span></p></body></html>

Action类:
package qy.test.action;import java.util.HashMap;import java.util.Map;import net.sf.json.JSONObject;import com.opensymphony.xwork2.ActionSupport;public class AjaxLoginAction extends ActionSupport {// 用户Ajax返回数据private String result;// struts的属性驱动模式,自动填充页面的属性到这里private User user;public String getResult() {return result;}public void setResult(String result) {this.result = result;}public User getUser() {return user;}public void setUser(User user) {this.user = user;}@Overridepublic String execute() {// 用一个Map做例子Map<String, String> map = new HashMap<String, String>();// 为map添加一条数据,记录一下页面传过来loginNamemap.put("name", user.getLoginName());// 将要返回的map对象进行json处理//JSONObject jo = JSONObject.fromObject(map);JSONObject jo = new JSONObject();jo.element("map", map);// 调用json对象的toString方法转换为字符串然后赋值给resultthis.result = jo.toString();// 可以测试一下resultSystem.out.println(this.result);return SUCCESS;}}

实体类:
package qy.test.action;import java.io.Serializable;@SuppressWarnings("serial")public class User implements Serializable{private String loginName;private String password;public String getLoginName() {return loginName;}public void setLoginName(String loginName) {this.loginName = loginName;}public String getPassword() {return password;}public void setPassword(String password) {this.password = password;}}

前台如何将多个json对象传入java后台
1. 将要传入后台的数据组装成JSON格式的字符串:
var jsonStr = [{'name':'jim' , 'age':'20'} , {'name':'king' , 'age':'26'},{'name':'jge' , 'age':'30'}]
 
2. 使用JQuery的ajax请求后台
jQuery.ajax({
            type: "post",
            url: url,
            dataType : 'json',
            data : {'mydata':jsonStr},
            success: function(data,textStatus){
                alert("操作成功");
            },
            error: function(xhr,status,errMsg){
                alert("操作失败!");
            }
});
 
3.后台数据的接收与解析:
String jsonStr = request.getParameter("jsonStr");
JSONArray jsonArray =  new JSONArray(jsonStr); 
for(int i=0;i<jsonArray.length(); i++){
JSONObject jsonJ = jsonArray.getJSONObject(i); 
int age = jsonJ.getInt("age");
String name = jsonJ.getString("name"); 
                                                 
}
0 0
原创粉丝点击