Struts2+jQuery,使用ajax传递JSON数据

来源:互联网 发布:上海摩根士丹利it待遇 编辑:程序博客网 时间:2024/05/01 21:21

服务器端

需要导入struts2-json-plugin包。
修改struts.xml配置文件,将package节点的extends属性由默认的struts-default改为json-default。

<struts>    <package name="default" extends="json-default">    </package></struts>

需要发送JSON的action配置

<action name="initMenu" class="menuAction">    <result name="result" type="json"/></action>

在Action类里,需要有一个对应的名为result的JSON数组对象(不能为JSON格式的字符串对象)

class MenuAction extends ActionSupport{    private JSONArray result;    private DishService dishService;    //省略Setter    public String init(){        List<Dish> list = dishService.findAll();        result = JSONArray.fromObject(list);        return "result";    }}

配置文件中result节点还有可以有一个子节点

<action name="initMenu" class="menuAction" method="init">    <result name="result" type="json">        <param name="root">dishList</param>    </result></action>

name为root代表返回的对象是从Action类的全局变量中寻找名字为”dishList”的变量。

前端jQuery接收JSON

 $.getJSON("initMenu.action", function (data) {        $.each(data.result, function (index, object) {            showMenu(object);        });    });

$.getJSON方法设置回调函数,处理服务器发送的数据data,格式为JSON,然后使用$.each对JSON数据遍历处理。服务器返回的数据,对前端而言是key为“data”的一个JSON,真正需要处理的数据(result)被包含在data里,所以在遍历时要指明遍历的是data.result。

需要接收JSON数据的action配置

<action name="complete" class="menuAction" method="complete">    <interceptor-ref name="defaultStack"/>    <interceptor-ref name="json">        <param name="contentType">application/json</param>    </interceptor-ref>    <result name="success">menu.jsp</result></action>

此处配置与Action类需要与前端js代码对应。

class MenuAction extends ActionSupport{    private JSONArray result;    private DishService dishService;    private List<Detail> data;    private int receive;    //省略Setter、Getter    public String init(){        List<Dish> list = dishService.findAll();        result = JSONArray.fromObject(list);        return "result";    }    public String complete(){        //处理data、receive    }}

前端代码

//数据采集与组装$.ajax({    type: "post",    url: "complete.action",    data: "{\"data\":" + data + ", \"receive\":" + receive + "}",    contentType: "application/json;charset=utf-8",    dataType: 'json',    async: true});

此处”contentType”、”dataType”、”data”均需与服务器端对应,data的值为一个自己拼装的JSON对象。

0 0
原创粉丝点击