Solved

jquery countdown - how to prevent timer from resetting on page reload?

Posted on 2011-09-24
3
4,032 Views
Last Modified: 2012-05-12
I'm using jquery countdown (http://keith-wood.name/countdown.html) in a script, but I can't figure out how to prevent the timer from resetting on a page reload...  Hoping someone knows how or can give me a suggestion?  I'm using php, so I thought maybe at some point, I can add a variable to a $_SESSION, but is that enough?
0
Comment
Question by:n00b0101
3 Comments
 
LVL 83

Expert Comment

by:Dave Baldwin
ID: 36593833
A full page reloads all code including javascript.  Any scripts running on the previous page are gone.  You would have to load a variable to restart the counter on the reloaded page.
0
 
LVL 109

Accepted Solution

by:
Ray Paseur earned 500 total points
ID: 36593863
There is no really good answer for what you want to do, but this might be somewhat useful.  First, read this article carefully so that you understand the DATETIME arithmetic issues.
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/A_201-Handling-date-and-time-in-PHP-and-MySQL.html

You can write a timer value into the browser output stream with something like the code shown in the snippet.  You can also keep a timer value in a data base or in the session array.  So every time the page is loaded, you can take the original time, subtract the time of "now" and that will give you the amount of remaining time to put into the JavaScript.  Obviously if the end of time has already come you will have some kind of special processing to do, like telling the client, "Sorry!"

HTH, ~Ray
<?php // RAY_countdown_timer.php
error_reporting(E_ALL);

// SET THE TIMER VALUE IN THE PHP SCRIPT
$timer = '7';
?>

<script type="text/javascript">
var interval = "";
var sekonds  = <?php echo $timer; ?>;

function startInterval()
{
    interval = window.setInterval("tTimer()",1000);
}
function stopInterval()
{
    window.clearInterval (interval);
    interval="";
}
function tTimer()
{
    document.thinkTime.tDisplay.value = sekonds--;
    if (sekonds == -1)
    {
        stopInterval();
    }
}
</script>

<script>
document.write('<meta http-equiv=\"Refresh\" content=\"<?php echo $timer; ?>;url=http://lmgtfy.com?q=JavaScript+Timer\">');
</script>

<form name="thinkTime">
This page will search for a JavaScript Timer in
<input readonly class="timerBox" size="1" type="text" name="tDisplay" value="">
<script>startInterval();</script>
seconds.
</form>
<a href="http://lmgtfy.com?q=JavaScript+Timer">Click here if you don't want to wait.</a>

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
ID: 36593913
0

Featured Post

Active Directory Webinar

We all know we need to protect and secure our privileges, but where to start? Join Experts Exchange and ManageEngine on Tuesday, April 11, 2017 10:00 AM PDT to learn how to track and secure privileged users in Active Directory.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

OverviewThis article demonstrates a simple search form using AJAX. The purpose of the article is to demonstrate how to use the same code to render a page and javascript (JQuery) and AJAX to make subsequent calls to refine the results. The princip…
Introduction This article is intended for those who are new to PHP error handling (https://www.experts-exchange.com/articles/11769/And-by-the-way-I-am-New-to-PHP.html).  It addresses one of the most common problems that plague beginning PHP develop…
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question