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":"議"}
];