如何只刷新jsp页面的一个分区

时间:2016-02-17 09:41:06

标签: java jsp

我正在开发一个Web应用程序,我有一个jsp页面,其中我有一个表和其他一些东西。我想要的是每5秒刷新一次表的内容。下面是我的jsp页面代码。任何人都可以帮我解决问题。

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"       "http://www.w3.org/TR/html4/loose.dtd">

<%@ page language="java" %>
<%@ page import="java.sql.*" %>
<%@ page import="java.util.Calendar" %>
<%@ page import="java.text.DateFormat" %>
<%@ page import="java.util.Date" %>
<%@ page import="java.text.SimpleDateFormat" %>
<HTML>
<HEAD>
    <TITLE>Welcome to Crevavi </TITLE>

</HEAD>

<div style="width:950px; height:900; padding:10px; border:10px ridge black;">
<body bgcolor="white"; border="3px">
<img src="Crevavi_Plain.jpg" background-color="white"  width="100" height="25" style=float:right;/>
<h1 style=margin-left:2px;><font size="5">  Crevavi  Web  Application</font></h1>
<hr color="black">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
var auto = setInterval(    function ()
         {
              $("#result").load("NewTable.html #result");
         }, 5000); // refresh every 5000 milliseconds
        </script>

//I want only the below division to refresh every 5 seconds.



  <div id="result" style="width:930px; height:500; padding:5px; border:5px ridge black;">
 <% 
    int rowCount = 0;
    /*Calendar cal = Calendar.getInstance();
    Date date1=cal.getTime();
    DateFormat dateFormat = new SimpleDateFormat("dd/MM/yy,HH:mm:ss");
    String formattedDate=dateFormat.format(date1);
    System.out.println("Current time of the day using Calendar - 24 hour format: "+ formattedDate);
    String[] values = formattedDate.split(",");
    String date = values[0];
    String time = values[1];*/

Class.forName("com.mysql.jdbc.Driver");
        Connection connection = DriverManager.getConnection("jdbc:mysql://localhost:3306/students","root","root");

        Statement statement = connection.createStatement() ;

       /* String sql = "INSERT INTO TEXTDATA (MachID,Date,Time,Text1,Text2,Text3,Text4,Text5,Text6,Text7,Text8,Text9,Text10,Text11,Text12) VALUES  ('123','"+date+"','"+time+"','My','hello','thankyou','welcome','visit again','haha','good morning','sweet dreams','hi','hello','night','work')";
          ((java.sql.Statement) statement).executeUpdate(sql);*/

        ResultSet resultset = statement.executeQuery("select * from textdata order by Date desc, Time desc"); 
        while(resultset.next()){
            rowCount++;
        }
        int firstrow = rowCount-10;
        System.out.println(firstrow);
        if(rowCount > 10){
         resultset = statement.executeQuery("select * from textdata where Rowcount>'"+firstrow+"' order by Date desc, Time desc");  
        }else{
         resultset = statement.executeQuery("select * from textdata order by Date desc, Time desc");    
        }

    %>



    <TABLE BORDER="1">
        <TR>
            <TH>Mach ID</TH>
            <TH>Date</TH>
            <TH>Time</TH>
            <TH>Text1</TH>
            <TH>Text2</TH>
            <TH>Text3</TH>
            <TH>Text4</TH>
            <TH>Text5</TH>
            <TH>Text6</TH>
            <TH>Text7</TH>
            <TH>Text8</TH>
            <TH>Text9</TH>
            <TH>Text10</TH>
            <TH>Text11</TH>
            <TH>Text12</TH>
        </TR>
        <% while(resultset.next()){ %>

        <TR>
            <TD> <%= resultset.getInt(1) %></td>
            <TD> <%= resultset.getString(2) %></TD>
            <TD> <%= resultset.getString(3) %></TD>
            <TD> <%= resultset.getString(4) %></TD>
            <TD> <%= resultset.getString(5) %></TD>
            <TD> <%= resultset.getString(6) %></TD>
            <TD> <%= resultset.getString(7) %></TD>
            <TD> <%= resultset.getString(8) %></TD>
            <TD> <%= resultset.getString(9) %></TD>
            <TD> <%= resultset.getString(10) %></TD>
            <TD> <%= resultset.getString(11) %></TD>
            <TD> <%= resultset.getString(12) %></TD>
            <TD> <%= resultset.getString(13) %></TD>
            <TD> <%= resultset.getString(14) %></TD>
            <TD> <%= resultset.getString(15) %></TD>

        </TR>
        <% } %>
    </TABLE>
    </div>
    </br>

    <form name = "Field_Details" action = "ServletApp" method= "get">
    <fieldset style="float: center; width:900px; height: 75px;background-color:ivory; border-color:black;">
    <font size = "2">Output Field :</font> <input type="text" name="Text1" maxlength="50"  style="height:15px; width:100px; border-color:black"><font size = "2"></font>
    <font size = "2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;MachId :</font> <input type="text" name="Text2" maxlength="15"  style="height:15px; width:100px; border-color:black"><font size = "2"></font>
    <font size = "2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;From Date(dd/mm/yy) :</font> <input type="text" name="Text3" maxlength="8"  style="height:15px; width:100px; border-color:black"><font size = "2"></font>
    <font size = "2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;To Date(dd/mm/yy) :</font> <input type="text" name="Text4" maxlength="8"  style="height:15px; width:100px; border-color:black"><font size = "2"></font><br><br>
    <input type= "submit" value="Send" style="height:30px; width:80px; margin-left:15px">
    <input type= "submit" value="Search" style="height:30px; width:80px; margin-left:700px" onclick="form.action='FirstServlet';">

</BODY>
</HTML>   

2 个答案:

答案 0 :(得分:1)

JSP是服务器端技术,这意味着如果要刷新页面,则必须向服务器执行请求,该请求将返回新页面。不可能通过普通的JSP机制返回页面的一部分。

如果您只想刷新表格,则需要使用javascript对服务器进行ajax调用以获取所需数据,并使用此数据重新填充表格。

答案 1 :(得分:0)

我在NewFile.jsp

中修改了以下代码
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
        var auto = setInterval(    function refresh()
         {
              $("#result").load("DemoFile.jsp");

         }, 5000); // refresh every 5000 milliseconds
         refresh();
</script>

然后创建了一个名为DemoFile.jsp的新jsp文件,并复制了我要刷新的NewFile.jsp分区的部分代码。