標籤:
feedback.jsp:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <%String path = request.getContextPath();String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";String imgPath = request.getParameter("imgPath") == null ? "": request.getParameter("imgPath").toString().trim();System.out.println(imgPath);%><!DOCTYPE HTML><!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--><!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--><!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--><!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]--><head><base href="<%=basePath%>"><title>反饋資訊</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"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" type="text/css"href="<%=basePath%>bootstrap-3.2.0-dist/css/bootstrap.css"></link><link rel="stylesheet"href="<%=basePath%>bootstrap-3.2.0-dist/css/bootstrap-theme.css"type="text/css"></link><script type="text/javascript" src="<%=basePath%>bootmetro/js/jquery-1.10.0.min.js"></script><script src="<%=basePath%>bootmetro/js/modernizr-2.6.2.min.js"></script><script type="text/javascript"src="<%=basePath%>js/jquery-1.11.1.min.js"></script><script src="<%=basePath%>bootstrap-3.2.0-dist/js/bootstrap.min.js"></script><style type="text/css">.footer {position: absolute;bottom: 0;width: 100%;/*margin-left:-40px;*//* Set the fixed height of the footer here */height: 60px;background-color: #2F2F2F;/*#f5f5f5;*/}body{/*padding:50px;*/}.footer>.container {padding-right: 15px;padding-left: 15px;}</style></head><body><!-- Fixed navbar --><nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container" style="line-height:50px;"> <div style="text-align: center;"> <a style="color:white;font-size: 18px;text-decoration: none">反饋資訊</a> </div> </div> </nav> <div class="container" style="margin-top:20px;padding:50px"> <div class="row-fluid"> <div id="flushDIV" class="col-xs-12 col-sm-12 col-md-12" style="box-shadow:0 0 10px #666666;border-radius:8px;"> <table class="table table-hover" style="text-align: center;table-layout: fixed;"> <thead> <tr> <th style="text-align: center;">郵箱地址</th> <th style="text-align: center;">裝置ID</th> <th style="text-align: center;">電話號碼</th> <th style="width:200px; text-align: center;">本文</th> <th style="text-align: center;">時間</th> </tr> </thead> <c:forEach items="${page.datas}" var="utcFeedback" varStatus="vs"> <tr id="${utcFeedback.deviceId }"> <td>${utcFeedback.email }</td> <td>${utcFeedback.deviceId }</td> <td>${utcFeedback.phoneNo }</td> <!-- <td><a data-toggle="modal" data-target=".bs-example-modal-sm" href="javascript:void(0)">${utcFeedback.content }</a></td> --> <td>${utcFeedback.content }</td> <td>${utcFeedback.opTimer }</td> </tr> </c:forEach> <tr> <td colspan="5"> <c:if test="${page.totalCount > 0}"> <c:choose> <c:when test="${page.pageNo == 1}"> <a style="text-decoration: none">首頁</a> <a style="text-decoration: none">上一頁</a> </c:when> <c:otherwise> <a href="javascript:doPage(1);">首頁</a> <a href="javascript:doPage(${page.upPage});">上一頁</a> </c:otherwise> </c:choose> <c:choose> <c:when test="${page.pageNo == page.totalPage || page.totalPage == 0}"> <a style="text-decoration: none">下一頁</a> <a style="text-decoration: none">末頁</a> </c:when> <c:otherwise> <a href="javascript:doPage(${page.nextPage});">下一頁</a> <a href="javascript:doPage(${page.totalPage});">末頁</a> </c:otherwise> </c:choose><a style="text-decoration: none">當前第${page.pageNo}頁</a> <a style="text-decoration: none">共${page.totalPage}頁</a> </c:if><a style="text-decoration: none">共${page.totalCount}條資料</a> </td> </tr></table> </div> </div> </div> <div class="footer"><div class="container"></div></div><script type="text/javascript">function doPage(n){$('#flushDIV').html("");$.ajax({ type:"POST", url:"<%=basePath%>apps/queryFeedBackInfo.do", data:{pageNo:n}, dataType: "html", //傳回值類型 使用json的話也能夠,可是須要在JS中編寫迭代的html代碼,假設格式樣式 cache:false, success:function(data){ //var json = eval('('+msg+')');//拼接的json串 $('#flushDIV').html(data); }, error:function(error){alert(error);} });}</script></body></html>
conroller(詳細DAO和Page類省略):
/** * 顯示不同頁碼的反饋資訊 * @param request * @param response * @return * @throws Exception */@RequestMapping(value="/queryFeedBackInfo")public ModelAndView queryFeedBackInfo(HttpServletRequest request,HttpServletResponse response)throws Exception{UtcFeedbackDao utcFeedbackDao = new UtcFeedbackDao();int currentPage = request.getParameter("pageNo")==null?1:request.getParameter("pageNo").toString().trim()==""?1:Integer.parseInt(request.getParameter("pageNo").toString().trim());Pagination<UtcFeedback> page = null;//分頁協助類page = utcFeedbackDao.findByCondition(currentPage,pagesize);HashMap map = new HashMap(); map.put("page", page);return new ModelAndView("app/temp",map);}
temp.jsp:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>My JSP 'temp.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">--></head><body><table class="table table-hover" style="text-align: center;table-layout: fixed;"><thead><tr><th style="text-align: center;">郵箱地址</th><th style="text-align: center;">裝置ID</th><th style="text-align: center;">電話號碼</th><th style="width:200px; text-align: center;">本文</th><th style="text-align: center;">時間</th></tr></thead><c:forEach items="${page.datas}" var="utcFeedback" varStatus="vs"><tr id="${utcFeedback.deviceId }"><td>${utcFeedback.email }</td><td>${utcFeedback.deviceId }</td><td>${utcFeedback.phoneNo }</td><td>${utcFeedback.content }</td><td>${utcFeedback.opTimer }</td></tr></c:forEach><tr><td colspan="5"><c:if test="${page.totalCount > 0}"><c:choose><c:when test="${page.pageNo == 1}"><a style="text-decoration: none">首頁</a> <a style="text-decoration: none">上一頁</a> </c:when><c:otherwise><a href="javascript:doPage(1);">首頁</a> <a href="javascript:doPage(${page.upPage});">上一頁</a> </c:otherwise></c:choose><c:choose><c:whentest="${page.pageNo == page.totalPage || page.totalPage == 0}"><a style="text-decoration: none">下一頁</a> <a style="text-decoration: none">末頁</a> </c:when><c:otherwise><a href="javascript:doPage(${page.nextPage});">下一頁</a> <a href="javascript:doPage(${page.totalPage});">末頁</a> </c:otherwise></c:choose><a style="text-decoration: none">當前第${page.pageNo}頁</a> <a style="text-decoration: none">共${page.totalPage}頁</a> </c:if> <a style="text-decoration: none">共${page.totalCount}條資料</a> </td></tr></table></body></html>
著作權聲明:本文部落格原創文章。部落格,未經同意,不得轉載。
jquery ajax協調SpringMVCD實現局部重新整理IV