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>
/** * 显示不同页码的反馈信息 * @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); }
<%@ 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: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> </body> </html>
jquery ajax配合SpringMVC实现局部刷新DIV
原文地址:http://blog.csdn.net/liupeng_family/article/details/41008701