天天看點

ssh和springside 實作ajax傳回對象清單

ajaxPage 整個是關鍵

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@page import="com.bt.vo.ProductVO"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>" target="_blank" rel="external nofollow" >
    <title>json資料示範</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0"> 
	<script type="text/javascript" src="<%=basePath%>js/jquery-1.3.1.js"></script>
<%-- 	<script type="text/javascript">
    var xmlhttp;
      function showList(){
     
      if(window.ActiveXObject){
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }else{
        xmlhttp=new XMLHttpRequest();
      }
     xmlhttp.onreadystatechange=function(){
          if(xmlhttp.readyState==4){
           if(xmlhttp.status==200){
              //var texts=xmlhttp.responseText;
              //document.getElementById("sp").innerHTML=texts;
        //将json字元串轉換為json對象,需要注意調用eval函數時必須使用"("和")"将json字元串括起來
               var proudct=eval("("+xmlhttp.responseText+")");
               alert("1213"+proudct);
               var result="<table ;
                result+="<tr><td>序号</td><td>商品名</td><td>價格</td></tr>";
               for(var i=0;i<proudct.length;i++){
                 result+="<tr>";
                 result+="<td>"+proudct[i].productid+"</td>";
                 result+="<td>"+proudct[i].name+"</td>";
                 result+="<td>"+proudct[i].baseprice+"</td>";
                 result+="</tr>";
              }
                result+="</table>";       
                document.getElementById("resultDiv").innerHTML=result;   
          }
       }
     }   
           //xmlhttp.open("GET","/house/findajax!list1.action",true);//因為ctx是這樣寫的
            xmlhttp.open("GET","<%=basePath%>product/findajax.action", true);
            //ajax的路徑是絕對路徑
            xmlhttp.send(null);
 }  
	</script>   --%>
<script type="text/javascript">	
    var pageNow=1;
    //控制jump按鈕事件 下面是一運作完dom元素(不加載圖檔和link)就運作js
     $(function(){
          alert("456");
        $("#first").click(function(){
           pageNow=1;
           //要設定current頁
           $("#lblCurrent").text(1);
          BindData();
        });
        
        //上一頁
        $("#toAfter").click(function(){
           if(pageNow!=1){
             pageNow--;
              $("#lblCurrent").text(pageNow);
           }
          BindData();
        });
        
        //下一頁
        $("#toNext").click(function(){
             var pageCount=parseInt($("#lblPageCount").text());
        if(pageNow!=pageCount){
           pageNow++;
           $("#lblCurrent").text(pageNow);
           }
            BindData();
        });
        
        //末頁
         $("#last").click(function(){
          var pageCount=parseInt($("#lblPageCount").text());
           pageNow=pageCount;
           $("#lblCurrent").text(pageNow);
           BindData();
        });
     });



	function BindData(){
	
	alert("123");
	      $.ajax({
	          type: "GET",
	          url: "<%=basePath%>product/findajax.action",
	           data: "pageNow="+pageNow,
	         dataType: "json",
	          success: function(data){
	              var result="<table ;
	              $.each(data,function(index,item){
	                  result+="<tr>";
	                  result+="<td>"+item.productid+"</td>";
	                  result+="<td>"+item.name+"</td>";
	                  result+="<td>"+item.baseprice+"</td>";
	                  result+="</tr>";
	              });
	              result+="</table>"
	             $("#resultDiv").html(result);
	          }      
	      });
	BindPageCount();
	BindRowCount();
	checkJump();
	}
	
	function BindPageCount(){
	alert("BindPageCount方法");
	   $.ajax({
	        type:"GET",
	         dataType:"text",
	        url:"<%=basePath%>product/findCount.action",
	       async:false,
	       success:function(data){
	       alert(data);
	       $("#lblPageCount").html(data);
	       }
	   });
	}
	
	function BindRowCount(){
	alert("BindRowCount方法");
	  $.ajax({
	        type:"GET",
	        dataType:"text",
	         url:"<%=basePath%>product/findRCount.action",
	  	     async:false,
	  	     success:function(data){
	  	      alert(data);
	  	     $("#lblRowCount").html(data);
	  	     }
	  	  });
	}
	
	//驗證是否跳轉頁生效
	function checkJump(){
	alert("checkJump方法");
	 var pageCount=parseInt($("#lblPageCount").text());
	    if(pageCount==0){
	       $("#lblCurrent").text(0);
	    }
	    if(pageNow!=1){
	      $("#lblCurrent").text(pageNow);
	    }else{
	       $("#lblCurrent").text(1);
	    }
	   if(pageNow<pageCount){
            $("#lblCurrent").text(pageNow);	   
	   }else{
	        $("#lblCurrent").text(1);
	   }
	   //控制jump
	  document.getElementById("first").disabled=(pageNow=1)?true:false;
	  document.getElementById("toAfter").disabled=(pageNow<1)?true:false;
	  document.getElementById("toNext").disabled=(pageNow>=pageCount)?true:false;
	  document.getElementById("last").disabled=(pageNow==pageCount)?true:false;
	}
	
</script>
	
  </head>
  <body>
      <br><input type="button" value="送出" id="but" οnclick="BindData()"/>
   <div id="resultDiv"></div>
   <div id=navigation>
   <div>
   總共<label id="lblRowCount"></label>記錄   目前<label id="lblCurrent"></label>頁  
  共<label id="lblPageCount"></label>頁
   </div>
   <div>
   <input type="button" id="first" value="首頁"/>
   <input type="button" id="toAfter" value="上一頁"/>
   <input type="button" id="toNext" value="下一頁"/>
   <input type="button" id="last" value="末頁"/>
   </div>
   </div>
  </body>
</html>
           

struts_product.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>

<package name="product" extends="struts-default,json-default," namespace="/product">
 <action name="getList" class="paction" method="getList">
   <result name="success">/product/productlist.jsp</result>
 </action>
 
  <action name="showDetail" class="paction" method="showDetail">
   <result name="success">/product/productDetail.jsp</result>
 </action>
 
  <action name="findajax" class="paction" method="findAjax">
   <result type="json" name="success">
   <param name="root">plists</param>
</result>
 </action>
 
   <action name="findCount" class="paction" method="findCount">
   <result name="input">/product/ajaxPage.jsp</result>
 </action>
 
  <action name="findRCount" class="paction" method="findRCount">
  <result name="input">/product/ajaxPage.jsp</result>
 </action>

</package>
</struts>    
           

ProductAction 頁面互動時候set,get不能少,(是頁面的給set和得到get)

package com.bt.control;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;

import javax.servlet.http.HttpServletRequest;

import org.apache.struts2.ServletActionContext;

import com.bt.dao.ProductDAO;
import com.bt.service.ProductService;
import com.bt.service.impl.ProductServiceImpl;
import com.bt.util.WebConstant;
import com.bt.vo.ProductVO;
import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionSupport;

public class ProductAction extends ActionSupport {
	private Integer productid;
	private ProductService ps;


	private int pageNow;
	private int pageSize;
	private List<ProductVO> plists;
	private int pageCount;
	private int rowCount;

	public int getPageCount() {
		return pageCount;
	}

	public void setPageCount(int pageCount) {
		this.pageCount = pageCount;
	}

	public int getRowCount() {
		return rowCount;
	}

	public void setRowCount(int rowCount) {
		this.rowCount = rowCount;
	}

	public List<ProductVO> getPlists() {
		return plists;
	}

	public void setPlists(List<ProductVO> plists) {
		this.plists = plists;
	}

	public int getPageNow() {
		return pageNow;
	}

	public void setPageNow(int pageNow) {
		this.pageNow = pageNow;
	}

	public int getPageSize() {
		return pageSize;
	}

	public void setPageSize(int pageSize) {
		this.pageSize = pageSize;
	}

	public ProductService getPs() {
		return ps;
	}

	public Integer getProductid() {
		return productid;
	}

	public void setProductid(Integer productid) {
		this.productid = productid;
	}

	public void setPs(ProductService ps) {
		this.ps = ps;
	}

/*	public String getList() {
		System.out.println("---------------------------------");
		HttpServletRequest request = ServletActionContext.getRequest();
		// int pageNow=Integer.parseInt(request.getParameter("pageNow"));
		// int pageSize= Integer.parseInt(request.getParameter("pageSize"));
		// 隻要在action裡面定義同名字的屬性 jsp裡面的資料可傳過來
		List<ProductVO> plist = ps.findAll(pageNow, 5);
		int pageCount = ps.getPageCount();
		request.setAttribute("pageCount", pageCount);
		request.setAttribute("pageSize", pageSize);
		request.setAttribute("pageNow", pageNow);
		 ActionContext.getContext().put(WebConstant.REQUEST_DATA_LIST, plist);
		request.setAttribute("resault", plist);
		return SUCCESS;
	}
*/
	public String showDetail() {
		ProductVO vo = ps.load(productid);
		ActionContext.getContext().put(WebConstant.REQUEST_DATA_LIST, vo);
		return SUCCESS;
	}

	public String findAjax() throws IOException {
		plists = ps.findAll(pageNow, 2);
		//PrintWriter out=ServletActionContext.getResponse().getWriter();
		//out.print(plists);
		return SUCCESS;
	}
	public String findCount() throws Exception{
		pageCount = ps.getPageCount();
		PrintWriter out=ServletActionContext.getResponse().getWriter();
		String p=String.valueOf(pageCount);
		out.print(p);
	    return NONE;
	}
	public String findRCount() throws Exception{
	    rowCount = ps.getRowCount();
	    PrintWriter out=ServletActionContext.getResponse().getWriter();
		String p=String.valueOf(rowCount);
		out.print(p);
	    return NONE;
	}

}
           

原始的ajax互動 可使用springSide  action的

public void list1() throws Exception { // 資料的詳細清單
		map = new HashMap();
		map.put("jclg", "2ben");
		map.put("hbdx", "1ben");
		map.put("zkr", "dgs");
		/*
		 * set=map.entrySet(); Iterator it=set.iterator(); while(it.hasNext()){
		 * entry1=(Map.Entry)it.next(); }
		 */
		list = new ArrayList();
		list.add("123");
		list.add("456");
		/*
		 * if(account.equals("sun")){ msg="對不起賬号已經存在"; }else{ msg=""; }
		 */
		// struts裡面調用servlet api
		/*
		 * ServletActionContext.getResponse().setCharacterEncoding("utf-8"); //
		 * 把組裝好的html代碼回傳給ajax PrintWriter out
		 * =ServletActionContext.getResponse().getWriter(); out.println(msg);
		 */
		List<House> houseList = houseEntityManager.getHouse();
		ServletActionContext.getResponse().setCharacterEncoding("utf-8");
		PrintWriter out = ServletActionContext.getResponse().getWriter();
		out.println(JSONArray.fromObject(houseList).toString());
	}
           
var resultValue=$.ajax({
				 async: false,
				 type: "POST",
				 url: "sys-notebook!getNotebookDay.action",
				 data: "sYear="+sYear+"&sMonth="+sMonth,
				 success : function(data){//json對象
				 }
			}).responseText;
		   resultValueObj=eval("("+resultValue+")");
           

$.ajax({

 url:'',

 data:{

   param1:'',

   param2:''

  }

});

  var resultJson =    

            [   

                {"dealDate":"3","title":"政務公開","type":"會"},   

                {"dealDate":"3","title":"交作業","type":"待"}, 

{"dealDate":"3","title":"上班去","type":"議"}, 

{"dealDate":"11","title":"想辦法","type":"待"},

{"dealDate":"4","title":"交報告","type":"會"},

{"dealDate":"5","title":"交電費","type":"議"},

{"dealDate":"6","title":"上課去","type":"待"},

{"dealDate":"7","title":"無語啊","type":"會"},

{"dealDate":"7","title":"随便寫","type":"待"},

   {"dealDate":"7","title":"想這樣","type":"議"},

{"dealDate":"15","title":"好好學習","type":"待"},

{"dealDate":"15","title":"天天向上","type":"議"}

            ];  

繼續閱讀