javaweb项目想做无刷更新表格,表格来源是sqlserver数据表的四个字段

test.jsp的代码如下:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.util.*" %>
<%@ page import="java.sql.*" %>
<%@ page import="java.io.*,java.util.*,java.sql.*"%>
<%@ page import="javax.servlet.http.*,javax.servlet.*" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql"%>
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="bookmark" href="/favicon.ico" type="image/x-icon" />
  <html>
 
   <head>
	<link rel="shortcut icon"  href="image/zhengKe.ico" type="image/x-icon" />
     <title>铝水称重看板 sql测试</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">
   </head>
      <body>
		<script>
			     $(function(){
			    test();
			    setInterval(test, 3000);                //循环执行,定时10秒
			    function test(){
			        $.ajax({
			            type: 'GET',
			            url: 'http://10.150.30.77:3465/test2/test2.jsp'                    //请求地址
			            //data: {carno:'1009'},             //请求参数
			            dataType: 'json',
			            success: function(data){
			                console.info(data);
			                var testTbody = $("#test");
			                testTbody.empty();          //若不做清空处理,列表则会重复叠加
			                if(data){
			                    $.each(data, function(i, list){
			                        var test = "<tr>" + 
			                                        "<td>" + list.A + "<td>" +
			                                        "<td>" + list.B + "<td>" +
			                                        "<td>" + list.C + "<td>" +
			                                        "<td>" + list.D + "<td>" +			                                   
			                                    "</tr>";
			                         testTbody.append(test);
			                     });
			                }
			            }
			        });
			    }
			});

   </script>  
	 
   </body>
 </html>

test2.jsp代码如下:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.util.*" %>
<%@ page import="java.sql.*" %>
<%@ page import="java.io.*,java.util.*,java.sql.*"%>
<%@ page import="javax.servlet.http.*,javax.servlet.*" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql"%>
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="bookmark" href="/favicon.ico" type="image/x-icon" />
  <html>
 
   <head>
	<link rel="shortcut icon"  href="image/zhengKe.ico" type="image/x-icon" />
     <title>铝水称重看板 sql测试</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">
   </head>
      <body>
<%-- 	<% Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver"); 
	Connection con=DriverManager.getConnection("jdbc:sqlserver://10.150.35.2:1433;databaseName=reserve1","sa","cfc123");
	Statement sta=con.createStatement();
	ResultSet rs=sta.executeQuery("select top 10 * from Trade order by CompletionDate desc");
	while(rs.next()) {%> 
	登记时间:<%=rs.getString(1)%>  
	来访时间:<%=rs.getString(2)%> 
	单位:<%=rs.getString(3)%>  
	部门:<%=rs.getString(4)%> 
	<br> 
	 <%}%>  
	  <%rs.close();  
	 sta.close();  
	 con.close();  
	 %>  --%>
	 <sql:setDataSource var="snapshot" driver="com.microsoft.sqlserver.jdbc.SQLServerDriver"
     url="jdbc:sqlserver://10.150.30.77:1433;databaseName=reserve1"
     user="sa"  password="cfc123"/>
     <sql:query dataSource="${snapshot}" var="result">
	select top 10 * from test order by ID desc;
	</sql:query>
	<h1 align="center">铝水净重看板</h1>
		<table  class="table table-hover" border="1" width="100%">
		<thead class="table-header">
		   <th>时间</th>
		   <th>牌号</th>
		   <th>名称</th>
		   <th>净重</th>
		</thead>
		<c:forEach var="row" items="${result.rows}">
		  <tbody id="test">
		   <td align="center"><c:out value="${row.A}"/></td>
		   <td><c:out value="${row.B}"/></td>
		   <td><c:out value="${row.C}"/></td>
		   <td><c:out value="${row.D}"/></td>
		 </tbody>
		</c:forEach>
		</table> 

   </body>
 </html>

运行test.jsp无效果,才接触javaweb,对servlet ,ajax(其中的url不是很懂),改如何通过test无刷更新数据表,请详细介绍点,谢谢大家了!!

你请求jsp响应给你的是jsp渲染的html数据。你的需要应该要自己写一个Servlet。响应json数据的Servlet。

1 个赞