struts2+jquery实现ajax异步提交并返回json串

来源:互联网 发布:优酷会员淘宝上没得卖 编辑:程序博客网 时间:2024/05/16 09:54

rt.



一、环境准备struts2.3+jquery1.12+jackson1.9
除了struts2核心jar包外,还需下载struts2-json-plugin.jar,否则运行报错!!!


二、代码
testAJAX.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"><title>struts2+jquery</title></head><body>    <div>        <h5>录入数据</h5>        <br />        <form action="#" method="post">            <label>姓名:</label><input type="text" name="name" /> <label>年龄:</label><input                type="text" name="age" /> <label>职务:</label><input                type="text" name="position" /> <input type="button" class="btn"                value="提交结果" />        </form>        <br />        <h5>显示结果</h5>        <br />        <ul>            <li>姓名:<span id="s_name">none</span></li>            <li>年龄:<span id="s_age">none</span></li>            <li>职务:<span id="s_position">none</span></li>        </ul>    </div>    <script type="text/javascript" src="jquery/jquery-1.12.0.min.js"></script>    <script type="text/javascript">        /* 页面加载完成,绑定事件 */        $(document).ready(function() {            btn();        });        /* 提交结果,执行ajax */        function btn() {            var $btn = $("input.btn");//获取按钮元素            //给按钮绑定点击事件            $btn.bind("click", function() {                $.ajax({                    type : "post",                    url : "excuteAjaxJsonAction",//需要用来处理ajax请求的action,excuteAjax为处理的方法名,JsonAction为action名                    data : {//设置数据源                        name : $("input[name=name]").val(),                        age : $("input[name=age]").val(),                        position : $("input[name=position]").val()                    },                    dataType : "json",//设置需要返回的数据类型                    success : function(data) {                        alert("data=" + data);                        var d = eval("(" + data + ")"); //将数据转换成json类型,可以把data用alert()输出出来看看到底是什么样的结构                        alert("d.length=" + d.length);                        $("#s_name").text("" + d[0].name + "");                        $("#s_age").text("" + d[0].age + "");                        $("#s_position").text("" + d[0].posititon + "");                    },                    error : function() {                        alert("exception.");                    }                });            });        }    </script></body></html>

JsonAction.java
有一部分代码是做测试用,可以自动忽略。

import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import org.apache.log4j.Logger;import org.codehaus.jackson.map.ObjectMapper;import com.wyglxt.base.BaseAction;public class JsonAction extends BaseAction {    private static final long serialVersionUID = 7951770011065306314L;    private static final Logger log = Logger.getLogger(JsonAction.class);    private String result;    private String name;    private String age;    private String position;    /**     * 处理ajax请求     *      * @return SUCCESS     */    public String excuteAjax() {        try {            // 将数据存储在map里,再转换成json类型数据,也可以自己手动构造json类型数据            Map<String, Object> map = new HashMap<String, Object>();            map.put("name", name);            map.put("age", age);            map.put("position", position);            Test test = new Test();            test.setAge(age);            test.setName(name);            test.setPosititon(position);            List<Test> list = new ArrayList<Test>();            list.add(test);            // 将map对象转换成json类型数据            // JSONObject json = JSONObject.fromObject(map);            ObjectMapper mapper = new ObjectMapper();            // JsonGenerator generator =            // mapper.getJsonFactory().createJsonGenerator(System.out,            // JsonEncoding.UTF8);            // 给result赋值,传递给页面            setResult(mapper.writeValueAsString(list));            log.info(result);        } catch (Exception e) {            e.printStackTrace();        }        return SUCCESS;    }    public String getResult() {        return result;    }    public void setResult(String result) {        this.result = result;    }    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }    public String getAge() {        return age;    }    public void setAge(String age) {        this.age = age;    }    public String getPosition() {        return position;    }    public void setPosition(String position) {        this.position = position;    }}class Test {    private String name;    private String age;    private String posititon;    public String getName() {        return name;    }    public void setName(String name) {        this.name = name;    }    public String getAge() {        return age;    }    public void setAge(String age) {        this.age = age;    }    public String getPosititon() {        return posititon;    }    public void setPosititon(String posititon) {        this.posititon = posititon;    }}

struts.xml
这里需要注意:package必须从json-default继承而不是struts-default继承,否则程序启动报错,或者在package中添加result-type,形如:

<result-types>    <result-type name="json" class="org.apache.struts2.json.JSONResult"/></result-types>
<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC    "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN"    "http://struts.apache.org/dtds/struts-2.1.dtd"><struts>    <package name="default" namespace="/" extends="json-default">        <!-- for json -->        <action name="*JsonAction" method="{1}"            class="com.wyglxt.action.JsonAction">            <!-- 返回json类型数据 -->            <result type="json">                <param name="root">result<!-- result是action中设置的变量名,也是页面需要返回的数据,该变量必须有setter和getter方法 --></param>            </result>        </action>    </package></struts>

三、运行效果:
这里写图片描述

这里写图片描述

end.

0 0