jquery ajax協調SpringMVCD實現局部重新整理IV

來源:互聯網
上載者:User

標籤:

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

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.