jQuery Ajax PHP Countdown
I'm new to Javascript and jQuery and would like some help.
I am running a script that counts down from 10 minutes second by second. Here is the PHP. It should be simple enough. it sets a cookie "num" that holds the total number of seconds. The rest of the script breaks it down into minutes and seconds.
- <?php
$inTwoMonths = 60 * 60 * 24 * 60 + time();
if(isset($_COOKIE['num'])){
- $num = $_COOKIE['num'];
$sec = $num`;
if($sec<10){$sec="0$sec";}
$min = floor($num/60);
if($min<10){$min="0$min";}
$num--;
setcookie('num',$num, $inTwoMonths);
- $return['msg'] = "00:$min:$sec";
echo json_encode($return);
- }
else{
setcookie('num','600', $inTwoMonths);
}
?>
I know the PHP works as I was using .load() to retrieve it.
I am now trying to use .ajax() as I would like the countdown to pass other variables back like a command that once it is finished to stop the jQuery script from retrieving it. I know this is by clearing the interval by using clearInterval()
But as I am new to javascript I do not know exactly how to pass the variables back from PHP and run an if statment and run clearInterval()
So far I have got this far, but it is no longer working.
- <script src="jquery.js"></script>
<script>
$(document).ready(function()
{
//ajaxTime.php is called every second to get time from server
var refreshId = setInterval(function()
{
$.ajax({
type: "POST",
url: "new.php",
success: function(msgs){
$("#timeval").append(data.msg);
}
});
}, 1000);
//stop the clock when this button is clicked
$("#stop").click(function()
{
clearInterval(refreshId);
});
});
</script>
<div id="timeval"></div>
<button id="stop">Stop</button>
Any help is greatly appriciated.