您的位置：首页 > 编程语言 > Java开发

struts2 + ajax + json的结合使用，实例讲解

2012-02-09 21:18 701 查看

.准备工作

   ①ajax使用Jquery：jquery-1.4.2.min.js

②struts2与json的依赖包：struts2-json-plugin-2.2.3.jar

PS：版本可自己控制！~

2.过程

①引入json依赖包

②编写action类

③配置struts.xml

④编写页面

⑤测试

3.实例

① action类，JsonAction 注意包名

package com.zxt.action;

import com.opensymphony.xwork2.ActionSupport;

/**

*

* @Title: JsonAction.java

* @Package com.zxt.action

* @Description:struts2 + ajax + json用例

* @author zxt

* @date 2011-12-6 上午10:38:51

* @version V1.0

*/

public class JsonAction extends ActionSupport {

/**

*

*/

private static final long serialVersionUID = 7443363719737618408L;

/**

* 姓名

*/

private String name;

/**

* 身高

*/

private String inch;

/**

* ajax返回结果，也可是其他类型的，这里以String类型为例

*/

private String result;

@Override

public String execute() throws Exception {

  // TODO Auto-generated method stub

  if("张三".equals(name)) {

   result = "身份验证通过,身高为" + inch;

  } else

   result = "不是张三！";

  return SUCCESS;

}

public String getName() {

  return name;

}

public void setName(String name) {

  this.name = name;

}

public String getInch() {

  return inch;

}

public void setInch(String inch) {

  this.inch = inch;

}

/**

*

* @Title: getResult

* @Description:json调取结果

* @param @return

* @return String

* @throws

*/

public String getResult() {

  return result;

}

}

②struts配置。 struts.xml

创建一个新的package，引入json-default

<package name="ajax" extends="json-default">

      <action name="jsonAjax" class="com.zxt.action.JsonAction">

        

        <result type="json"></result>

      </action>

    </package>

③ 页面ajax写法，json.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="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" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<base href="<%=basePath%>">

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<title>测试</title>

<script type="text/javascript" src="include/js/jquery-1.4.2.min.js"></script>

<script type="text/javascript">

   $(function() {

     $("#tj").click(function() {

    //提交的参数，name和inch是和struts action中对应的接收变量

        var params = {

           name : $("#xm").val(),

           inch : $("#sg").val()

        };

        $.ajax({

    type: "POST",

    url: "jsonAjax.action",

    data: params,

    dataType:"text",

    success: function(json){ //ajax返回值设置为json

    var obj = $.parseJSON(json); //使用这个方法解析json

                var state_value = obj.result; //result是和action中定义的result变量的get方法对应的

    alert(state_value);

    },

    error: function(json){

     alert("json=" + json);

     return false;

    }

    });

     });

   });

</script>

</head>

<body>

<span>姓名：</span><input id="xm" type="text">

<br/>

<span>身高：</span><input id="sg" type="text">

<br/>

<input type="button" value="提交" id="tj">

</body>

</html>

④启动站点，测试吧！~

按这个走完，一切ok。准备测试吧，看看它的强大效果！~O(∩_∩)O~

这只是最简单的一个例子（前后台交互），他能做的工作是非常多的，尽情发挥你的才能吧！~

good luck！

PS：

JQuery解析list的时候可参考，下面的小例子

var data = {"list":[{"id":1,"content":"测试信息1111"},{"id":2,"content":"测试信息2222"}]}

   $.each(data.list, function(i, item) {

      alert(item.id);

      alert(item.content);

   });

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： struts json ajax string action function

相关文章推荐

新的分享

章节导航