struts2學習筆記–使用struts2外掛實現ajax處理(返回json資料)

冬至飲雪發表於2016-02-17
筆記JSON

　　貼一個簡單的例子,通過jquery的post呼叫action,定義一個物件User,有name和age屬性,例項化幾個物件,以json的格式返回到jsp,在前臺頁面顯示出來,模擬使用者列表.

  • 　　匯入相關jar包:
  1. ezmorph-1.0.6.jar
  2. json-lib-2.3-jdk15.jar
  3. struts2-json-plugin-2.3.16.1.jar
  • Action程式碼:
package com.wang.action;

import java.util.ArrayList;
import java.util.List;

import com.opensymphony.xwork2.Action;
import com.wang.entity.User;

import net.sf.json.JSONArray;

public class JsonAction {

    private JSONArray root;

    public String execute(){
        List<User> list=new ArrayList<User>();
        list.add(new User("wang",20));
        list.add(new User("yong",22));
        list.add(new User("guo",23));
        root=JSONArray.fromObject(list);
        System.out.println("json="+root.toString());
        return Action.SUCCESS;
    }
    public JSONArray getRoot() {
        return root;
    }

    public void setRoot(JSONArray root) {
        this.root = root;
    }
    
    
}
  •  jsp頁面:
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP `ajax.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">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script type="text/javascript" src="jquery/jquery.min.js"></script>
    <script type="text/javascript">
        $(function(){
            $(`#btn1`).click(function(){
                $.post("json.action",function(data){
                    var html="";
                    for(var i=0;i<data.length;i++){
                        html+="<tr><td>"+data[i].name+"</td><td>"+data[i].age+"</td></tr>";
                    }
                    $(`#content`).html(html);
                });
            });
            $(`#btn2`).click(function(){
            //    alert("a");
                $(`#content`).css("display","none");
            });
            
        });
    </script>
  </head>
  
  <body>
    <input type="button" name="btn" id="btn1" value="獲取json"/><br>
    <table width="80%" align="center">
        <tr>
            <td>姓名</td>
            <td>年齡</td>
        </tr>
        <tbody id="content">
        
        </tbody>
    </table>
     <input type="button" name="btn" id="btn2" value="隱藏json資訊"/><br>
  </body>
</html>
  • struts.xml:
<?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>
<!--注意這裡繼承的json-default,間接地也繼承struts-default-->    
    <package name="default" extends="json-default" namespace="/">
        <action name="json" class="com.wang.action.JsonAction">
            <result type="json">
                <param name="root">root</param>
            </result>
        </action>
    </package>
</struts>

 


相關文章