feedback.jsp:

  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2. <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
  3. <%
  4. 	String path = request.getContextPath();
  5. 	String basePath = request.getScheme() + "://"
  6. 			+ request.getServerName() + ":" + request.getServerPort()
  7. 			+ path + "/";
  8.  
  9. 	String imgPath = request.getParameter("imgPath") == null ? ""
  10. 			: request.getParameter("imgPath").toString().trim();
  11. 	System.out.println(imgPath);
  12. %>
  13.  
  14. <!DOCTYPE HTML>
  15. <!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
  16. <!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
  17. <!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
  18. <!--[if gt IE 8]><!-->
  19. <html class="no-js">
  20. <!--<![endif]-->
  21. <head>
  22. <base href="<%=basePath%>">
  23.  
  24. <title>反馈信息</title>
  25.  
  26. <meta http-equiv="pragma" content="no-cache">
  27. <meta http-equiv="cache-control" content="no-cache">
  28. <meta http-equiv="expires" content="0">
  29. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  30. <meta http-equiv="description" content="This is my page">
  31.  
  32. <meta name="viewport" content="width=device-width, initial-scale=1">
  33.  
  34. <link rel="stylesheet" type="text/css"
  35. 	href="<%=basePath%>bootstrap-3.2.0-dist/css/bootstrap.css"></link>
  36. <link rel="stylesheet"
  37. 	href="<%=basePath%>bootstrap-3.2.0-dist/css/bootstrap-theme.css"
  38. 	type="text/css"></link>
  39.  
  40. <script type="text/javascript" src="<%=basePath%>bootmetro/js/jquery-1.10.0.min.js"></script>
  41. <script src="<%=basePath%>bootmetro/js/modernizr-2.6.2.min.js"></script>
  42. <script type="text/javascript"
  43. 	src="<%=basePath%>js/jquery-1.11.1.min.js"></script>
  44. <script src="<%=basePath%>bootstrap-3.2.0-dist/js/bootstrap.min.js"></script>
  45.  
  46. <style type="text/css">
  47. .footer {
  48. 	position: absolute;
  49. 	bottom: 0;
  50. 	width: 100%;
  51. 	/*margin-left:-40px;*/
  52. 	/* Set the fixed height of the footer here */
  53. 	height: 60px;
  54. 	background-color: #2F2F2F;/*#f5f5f5;*/
  55. }
  56.  
  57. body{
  58. 	/*padding:50px;*/
  59. }
  60.  
  61. .footer>.container {
  62. 	padding-right: 15px;
  63. 	padding-left: 15px;
  64. }
  65. </style>
  66. </head>
  67.  
  68. <body>
  69. 	<!-- Fixed navbar -->
  70. 	<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  71.       <div class="container" style="line-height:50px;">
  72.       <div style="text-align: center;">
  73.       	<a style="color:white;font-size: 18px;text-decoration: none">反馈信息</a>
  74.       </div>
  75.  
  76.       </div>
  77.     </nav>
  78.  
  79. 	 <div class="container" style="margin-top:20px;padding:50px">
  80. 	 	<div class="row-fluid">
  81. 	 		<div id="flushDIV" class="col-xs-12 col-sm-12 col-md-12" style="box-shadow:0 0 10px #666666;border-radius:8px;">
  82. 	 			<table class="table table-hover" style="text-align: center;table-layout: fixed;">
  83. 	 				<thead>
  84. 	 				<tr>
  85. 	 					<th style="text-align: center;">邮箱地址</th>
  86. 	 					<th style="text-align: center;">设备ID</th>
  87. 	 					<th style="text-align: center;">电话号码</th>
  88. 	 					<th style="width:200px; text-align: center;">正文</th>
  89. 	 					<th style="text-align: center;">时间</th>
  90. 	 				</tr>
  91. 	 				</thead>
  92. 	 			<c:forEach items="${page.datas}" var="utcFeedback" varStatus="vs">
  93. 	 				<tr id="${utcFeedback.deviceId }">
  94. 	 					<td>${utcFeedback.email }</td>
  95. 	 					<td>${utcFeedback.deviceId }</td>
  96. 	 					<td>${utcFeedback.phoneNo }</td>
  97. 	 					<!--
  98. 	 					<td><a data-toggle="modal" data-target=".bs-example-modal-sm" href="javascript:void(0)">${utcFeedback.content }</a></td>
  99. 	 					-->
  100. 	 					<td>${utcFeedback.content }</td>
  101. 	 					<td>${utcFeedback.opTimer }</td>
  102. 	 				</tr>
  103. 	 			</c:forEach>
  104. 	 					<tr>
  105. 	 						<td colspan="5">
  106. 	 							<c:if test="${page.totalCount > 0}">
  107. 	 								<c:choose>
  108. 	 									<c:when test="${page.pageNo == 1}">
  109. 	 										<a style="text-decoration: none">首页</a>    
  110. 	 										<a style="text-decoration: none">上一页</a>    
  111. 	 									</c:when>
  112. 	 									<c:otherwise>
  113. 	 										<a href="javascript:doPage(1);">首页</a>    
  114. 	 										<a href="javascript:doPage(${page.upPage});">上一页</a>    
  115. 	 									</c:otherwise>
  116. 	 								</c:choose>
  117. 	 								<c:choose>
  118. 	 									<c:when test="${page.pageNo == page.totalPage || page.totalPage == 0}">
  119. 	 										<a style="text-decoration: none">下一页</a>    
  120. 	 										<a style="text-decoration: none">末页</a>    
  121. 	 									</c:when>
  122. 	 									<c:otherwise>
  123. 	 										<a href="javascript:doPage(${page.nextPage});">下一页</a>    
  124. 	 										<a href="javascript:doPage(${page.totalPage});">末页</a>    
  125. 	 									</c:otherwise>
  126. 	 								</c:choose>
  127.  
  128. 								<a style="text-decoration: none">当前第${page.pageNo}页</a>    
  129. 								<a style="text-decoration: none">共${page.totalPage}页</a>    
  130. 								</c:if>
  131. 								<a style="text-decoration: none">共${page.totalCount}条数据</a>    
  132. 	 						</td>
  133. 	 					</tr>
  134. 				</table>
  135. 	 		</div>
  136.  
  137. 	 	</div>
  138. 	 </div>
  139.  
  140. 	<div class="footer">
  141. 		<div class="container">
  142. 		</div>
  143. 	</div>
  144. 	<script type="text/javascript">
  145. 		function doPage(n){
  146. 			$('#flushDIV').html("");
  147. 			$.ajax({
  148. 			       type:"POST",
  149. 			       url:"<%=basePath%>apps/queryFeedBackInfo.do",
  150. 			       data:{pageNo:n},
  151. 			       dataType: "html",   //返回值类型       使用json的话也能够，可是须要在JS中编写迭代的html代码，假设格式样式
  152. 			       cache:false,
  153. 			       success:function(data){
  154. 			           //var json = eval('('+msg+')');//拼接的json串
  155. 			           $('#flushDIV').html(data);
  156. 			       },
  157. 			       error:function(error){alert(error);}
  158. 			   });
  159. 		}
  160. 	</script>
  161.  
  162. </body>
  163.  
  164. </html>

conroller(详细DAO和Page类省略):

  1. /**
  2. 	 * 显示不同页码的反馈信息
  3. 	 * @param request
  4. 	 * @param response
  5. 	 * @return
  6. 	 * @throws Exception
  7. 	 */
  8. 	@RequestMapping(value="/queryFeedBackInfo")
  9. 	public ModelAndView queryFeedBackInfo(HttpServletRequest request,HttpServletResponse response)throws Exception{
  10. 		UtcFeedbackDao utcFeedbackDao = new UtcFeedbackDao();
  11. 		int currentPage = request.getParameter("pageNo")==null?
  12.  
  13. 1:request.getParameter("pageNo").toString().trim()==""?1:Integer.parseInt(request.getParameter("pageNo").toString().trim());
  14. 		Pagination<UtcFeedback> page = null;//分页帮助类
  15. 		page = utcFeedbackDao.findByCondition(currentPage,pagesize);
  16.  
  17. 		HashMap map = new HashMap();
  18. 	    map.put("page", page);
  19. 		return new ModelAndView("app/temp",map);
  20. 	}

temp.jsp:

  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2. <%
  3. 	String path = request.getContextPath();
  4. 	String basePath = request.getScheme() + "://"
  5. 			+ request.getServerName() + ":" + request.getServerPort()
  6. 			+ path + "/";
  7. %>
  8. <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
  9. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  10. <html>
  11. <head>
  12. <base href="<%=basePath%>">
  13.  
  14. <title>My JSP 'temp.jsp' starting page</title>
  15.  
  16. <meta http-equiv="pragma" content="no-cache">
  17. <meta http-equiv="cache-control" content="no-cache">
  18. <meta http-equiv="expires" content="0">
  19. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  20. <meta http-equiv="description" content="This is my page">
  21. <!--
  22. 	<link rel="stylesheet" type="text/css" href="styles.css">
  23. 	-->
  24.  
  25. </head>
  26.  
  27. <body>
  28. 	<table class="table table-hover" style="text-align: center;table-layout: fixed;">
  29. 		<thead>
  30. 			<tr>
  31. 				<th style="text-align: center;">邮箱地址</th>
  32. 				<th style="text-align: center;">设备ID</th>
  33. 				<th style="text-align: center;">电话号码</th>
  34. 				<th style="width:200px; text-align: center;">正文</th>
  35. 				<th style="text-align: center;">时间</th>
  36. 			</tr>
  37. 		</thead>
  38. 		<c:forEach items="${page.datas}" var="utcFeedback" varStatus="vs">
  39. 			<tr id="${utcFeedback.deviceId }">
  40. 				<td>${utcFeedback.email }</td>
  41. 				<td>${utcFeedback.deviceId }</td>
  42. 				<td>${utcFeedback.phoneNo }</td>
  43. 				<td>${utcFeedback.content }</td>
  44. 				<td>${utcFeedback.opTimer }</td>
  45. 			</tr>
  46. 		</c:forEach>
  47. 		<tr>
  48. 			<td colspan="5"><c:if test="${page.totalCount > 0}">
  49. 					<c:choose>
  50. 						<c:when test="${page.pageNo == 1}">
  51. 							<a style="text-decoration: none">首页</a>    
  52. 	 						<a style="text-decoration: none">上一页</a>    
  53. 	 					</c:when>
  54. 						<c:otherwise>
  55. 							<a href="javascript:doPage(1);">首页</a>    
  56. 	 						<a href="javascript:doPage(${page.upPage});">上一页</a>    
  57. 	 					</c:otherwise>
  58. 					</c:choose>
  59. 					<c:choose>
  60. 						<c:when
  61. 							test="${page.pageNo == page.totalPage || page.totalPage == 0}">
  62. 							<a style="text-decoration: none">下一页</a>    
  63. 	 						<a style="text-decoration: none">末页</a>    
  64. 	 					</c:when>
  65. 						<c:otherwise>
  66. 							<a href="javascript:doPage(${page.nextPage});">下一页</a>    
  67. 	 						<a href="javascript:doPage(${page.totalPage});">末页</a>    
  68. 	 					</c:otherwise>
  69. 					</c:choose>
  70.  
  71. 					<a style="text-decoration: none">当前第${page.pageNo}页</a>    
  72. 					<a style="text-decoration: none">共${page.totalPage}页</a>    
  73. 					</c:if> <a style="text-decoration: none">共${page.totalCount}条数据</a>    
  74. 			</td>
  75. 		</tr>
  76. 	</table>
  77. </body>
  78. </html>

版权声明：本文博客原创文章。博客，未经同意，不得转载。

jquery ajax协调SpringMVCD实现局部刷新IV的更多相关文章

  1. Django1.6 + jQuery Ajax + JSON 实现页面局部实时刷新

    最近微信公众帐号要扩展做一个签到系统,签到结果在一个网页上实时更新,即页面局部刷新.我想用Ajax来实现,之前公众帐号是用的Django搭的,我查找了Django的官方文档,没有封装Ajax.网上有各 ...

  2. java结合jQuery.ajax实现左右菜单联动刷新列表内容

    http://域名/一级菜单ID-二级菜单ID/ 用这种URL请求页面,出现如图所看到的内容: 该页面包括四部分,顶部文件夹+左側菜单+右側菜单+右下側数据列表. 左側菜单包括一级菜单和二级菜单,点击 ...

  3. 如何用php+ajax实现页面的局部刷新？（转）

    client.html XML/HTML code   ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <!DOCTYPE ...

  4. html ajax 异步加载 局部刷新

    1. getJSON 优点: 简单高效,直接返回处理好的json数据 缺点: 只能使用get请求和使用json数据 <script src ='jquery.min.js'></sc ...

  5. jQuery+ajax实现局部刷新

    在项目中,经常会用到ajax,比如实现局部刷新,比如需要前后端交互等,这里呢分享局部刷新的两种方法,主要用的是ajax里面的.load(),其他高级方法的使用以后再做详细笔记. 第一种: 当某几个页面 ...

  6. （局部刷新）jquery.ajax提交并实现单个div刷新

    web开发中我们经常会遇到局部刷新页面的需求,以前我经常使用ajax和iframe实现局部刷新,后来做政府的项目,对页面的样式要求比较多,发现使用iframe控制样式什么的很麻烦,所以就采用了新的办法 ...

  7. asp.net mvc3 利用Ajax实现局部刷新

    1.利用Ajax.ActionLink()方法 首先在_Layout.cshtml文件中加载 运行AJAX必要的Jquery <script src="@Url.Content(&qu ...

  8. jquery ajax php 无刷新上传文件 带 遮罩 进度条 效果的哟

    在很多项目中都会叫用户上传东西这些的,自从接触了jquery 和ajax之后就不管做什么,首先都会想到这个,我这个人呢?是比较重视客户体验的,这次我这边负责的是后台板块,然后就有一块是要求用户上传照片 ...

  9. ASP.Net 在Update Panel局部刷新后 重新绑定JS方法

    我们知道Asp.Net中的Update Panel可以完成页面的局部刷新(实质上是Ajax),但是局部刷新完后,此区域的控件上所绑定的JS方法就会失效,因为我们用如下方法来重新绑定. var prm ...

随机推荐

  1. Spring MVC 的json问题(406 Not Acceptable)

    原因 : 就是程序转换JSON失败. 在pom.xml 加上 <dependency> <groupId>com.fasterxml.jackson.core</grou ...

  2. [欧拉回路+手动开栈] poj 1780 Code

    题目链接: http://poj.org/problem? id=1780 Code Time Limit: 1000MS   Memory Limit: 65536K Total Submissio ...

  3. AVL树----java

                                                                                        AVL树----java AVL ...

  4. 定义自己的仪表板DashBoard - -kankanstyle

    既然做了奶站软件,需要使用的仪表板,显示质量数据 public class MDashboard extends ImageView { private Bitmap mPointerBitmap; ...

  5. Android触控屏幕Gesture(GestureDetector和SimpleOnGestureListener的使用教程)

    1.当用户触摸屏幕的时候,会产生许多手势,例如down,up,scroll,filing等等,我们知道View类有个View.OnTouchListener内部接口,通过重写他的onTouch(Vie ...

  6. TEXT文本编辑框4 点击按钮读取文本框内容到内表

    *&---------------------------------------------------------------------* *& Report ZTEST_CWB ...

  7. Servlet的学习之ServletContext（1）

    本篇来介绍Servlet中非常重要的对象,如ServletConfig类和ServletContext类,尤其是ServletContext类中的一些方法,本篇先讲述一部分,在下一篇中继续补充. 在对 ...

  8. kgdb调试注意事项

    0    首先提下注意事项的背景:    kgdb和printk共用一个串口 1    设置波特率:    //最高支持460800波特率    arm-eabi-gdb  ./vmlinux    ...

  9. Swift - 二进制，八进制，十六机制的表示方法

    当前位置: 首页 > 编程社区 > Swift > Swift - 二进制,八进制,十六机制的表示方法 Swift - 二进制,八进制,十六机制的表示方法 2015-01-23 14 ...

  10. 用Delphi画圆角Panel的方法（使用CreateRoundRectRgn创造区域，SetWindowRgn显示指定区域）

    用Delphi画圆角Panel的方法: procedure TForm1.Button5Click(Sender: TObject);var fhr :Thandle;beginfhr:=Create ...