Java 用按钮刷新jsp中的mysql表_Java_Mysql_Ajax_Jsp

Java 用按钮刷新jsp中的mysql表

java mysql ajax jsp

Java 用按钮刷新jsp中的mysql表,java,mysql,ajax,jsp,Java,Mysql,Ajax,Jsp,我试图从jsp页面上的mysql数据库中检索数据，当页面加载时，它会加载我想要的最新数据，但当我单击刷新按钮时，我使其使用旧数据刷新表，然后该按钮不起作用，之后不会刷新表 <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <%@ page import="java.sql.*, javax.sql.*, java.io.*, j

我试图从jsp页面上的mysql数据库中检索数据，当页面加载时，它会加载我想要的最新数据，但当我单击刷新按钮时，我使其使用旧数据刷新表，然后该按钮不起作用，之后不会刷新表

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.sql.*, javax.sql.*, java.io.*, javax.naming.*"%>


<!DOCTYPE html>
<html>
<head>
<title>Main Page</title>
<h1>
    <strong>test page</strong>
</h1>
<hr />
<canvas id="mycanvas" width="400" height="186"></canvas>
<script src="JavaScript/smoothie.js"></script>
<script src="JavaScript/chart.js"></script>
<script src="JavaScript/basic.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<script>
    $(document).ready(function(){
        $("#refresh").click(function(){
            $("#heart_rate").load("basic2.jsp")                             
            }); 
        }); 
    </script>
</head>
<body>
    <br>
    <br>
    <button id="refresh">Refresh table</button>
    <br>
    <br>
    <form method="post" name="form">
        <table id="heart_rate" border="1">
            <tr>
                <th>Sensor id</th>
                <th>Time stamp</th>
                <th>Heart rate</th>
                <th>Event time</th>
            </tr>
            <% 
 Connection con = null; 
 String url = "jdbc:mysql://localhost:3306/";
 String db = "Avantidrome";
 String driver = "com.mysql.jdbc.Driver";
 String un ="root";
 String pw="root";
 Statement st; 
 try{ 
     Class.forName(driver).newInstance(); 
     con = DriverManager.getConnection(url + db, un, pw); 
     String sql = "select * from avantidrome.heartratedata order by timestamp DESC limit 10";
     st = con.createStatement(); 
     ResultSet rs = st.executeQuery(sql); 
     %>
            <%
     while(rs.next())
     {
         %>
            <tr>
                <td><%=rs.getString(1)%></td>
                <td><%=rs.getString(2)%></td>
                <td><%=rs.getString(4)%></td>
                <td><%=rs.getString(5)%></td>
            </tr>
            <% 
             }

     %>
            <%
     } catch(Exception e){
         e.printStackTrace();
         }
 %>
        </table>
    </form>


</body>

</html>

单击按钮后，它将调用basic.jsp，它只是：

    <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="java.sql.*, javax.sql.*, java.io.*, javax.naming.*"%>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <br>
    <br>
    <form method="post" name="form">
        <table id="heart_rate" border="1">
            <tr>
                <th>Sensor id</th>
                <th>Time stamp</th>
                <th>Heart rate</th>
                <th>Event time</th>
            </tr>
            <% 
 Connection con = null; 
 String url = "jdbc:mysql://localhost:3306/";
 String db = "Avantidrome";
 String driver = "com.mysql.jdbc.Driver";
 String un ="root";
 String pw="root";
 Statement st; 
 try{ 
     Class.forName(driver).newInstance(); 
     con = DriverManager.getConnection(url + db, un, pw); 
     String sql = "select * from avantidrome.heartratedata order by timestamp DESC limit 10";
     st = con.createStatement(); 
     ResultSet rs = st.executeQuery(sql); 
     %>
            <%
     while(rs.next())
     {
         %>
            <tr>
                <td><%=rs.getString(1)%></td>
                <td><%=rs.getString(2)%></td>
                <td><%=rs.getString(4)%></td>
                <td><%=rs.getString(5)%></td>
            </tr>
            <% 
             }

     %>
            <%
     } catch(Exception e){
         e.printStackTrace();
         }
 %>
        </table>
    </form>


</body>

</html>

它所需要做的就是让按钮从数据库中选择最新的数据，并在每次单击时将其返回到表中。

有两种方法可以完成您想要的操作：

当用户按下刷新按钮时，您可以简单地刷新页面，这应该是如此之快，以至于他不会注意到页面已更改使用ajax。因此，如果选择此选项，您需要了解，要做到这一点，您只需要一个jsp，即在开始时加载页面并具有刷新按钮的jsp，一个处理刷新按钮并使用ajax获取新数据的javascript脚本，以及接收ajax请求并返回包含更新的json/xml格式的ajax响应的servlet。

在我看来，我更喜欢第一个选项，但如果你选择第二个选项，这里有另一个SO帖子可能会对你有所帮助：

快速提问，你为什么不使用servlet？另外，如果你选择第二个选项，你应该阻止刷新按钮，而你不会收到servlet的ajax响应。