Search code examples
javahtmljsppage-refreshpartial-page-refresh

Can I make a selective refresh of the contents in the JSP page?

It seems to be weird but still :

Is there any way I can make only the selective portion of the jsp page get refreshed ? Suppose :

<% response.setIntHeader("Refresh",1); // refresh at an interval of 1 second %>

<!-- Html5 snippet that plays a sound that lasts more than a second !-->

<% jsp code %>

Now, I want when the page gets refreshed the audio clip starts from where it left. Is that possible ? The clip's size is 2.4 MB ?

Solution

  • Use Jquery to refresh perticular div element in JSP

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#load_tweets').load('record_count.php').fadeIn("slow");
}, 10000); // refresh every 10000 milliseconds
</script>

<body>
  <div id="load_tweets"> </div>
</body>

    EDIT1

    reload-window.jsp // place this file in beside WEB-INF

    <%@page import="java.util.Calendar"%>
<%@page import="java.util.GregorianCalendar"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>

<%! GregorianCalendar newYear = new GregorianCalendar(2013, 0, 1);

    /*
     * 0 : January
     * 1 : 1st January
     * 2013 : year
     */%>
        <div>
        Time : 
        <%= (newYear.getTimeInMillis() - new GregorianCalendar().getTimeInMillis()) / 1000%>
        </div>

    main.jsp

    <%-- 
    Document   : nyblast
    Created on : Dec 26, 2012, 10:44:27 AM
    Author     : non-admin
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body bgcolor="#73AF59">

<script type="text/javascript" src="/js/jquery.min.js">

        </script>
<script type="text/javascript">
            var auto_refresh = setInterval(
            function ()
            {
                $('#load_tweets').load('reload-window.jsp').fadeIn("slow");
            }, 5000); // refresh every 10000 milliseconds

          </script>



<table width="100%">
    <tr>
        <td width="40%"></td>
        <td><img src="images/animations/pyear.gif" /></td>
    </tr>
    <tr>
        <td width="40%">
        <center><font face="Chiller" size="+6"> <br />
        Countdown </font></center>
        </td>
        <td>
        <center><font face="Chiller" size="+6"> <br />

        <div id="load_tweets"></div>
        </font></center>
        </td>
    </tr>
    <tr>
        <td colspan="2" style="height: 400px" valign="bottom"><img
            src="images/animations/3D_balloons.gif" /> <em>This poor design
        and animations compiled by Suhail Gupta.</em> <audio
            style="visibility: hidden"> </audio></td>
    </tr>
    <!-- !-->
</table>

</body>

</html>

    here the problem 

    $('#load_tweets').load('reload-window.jsp').fadeIn("slow");
                }, 5000); // refresh every 5000 milliseconds

    load function we need to pass our JSP which need to refresh

    Make sure your js is located to right palce.