javascript countdown update db and refresh - php

Question

can someone please help me with js/ajax countdown i want a countdown timer to 10 sec then update the database and refresh the page once it hits to 0.
i'm not really good with javascript/ajax, here is what i got so far:
var ss = 10;
function countdown() {
ss = ss-1;
if (ss<0) {
var url='update.php?countdown='+countdown;
}
else {
document.getElementById("countdown").innerHTML=ss;
window.setTimeout("countdown()", 1000);
}
}
<span id="countdown" style="color:green;">10</span>
and update.php file, witch works fine:
if (isset($_REQUEST['countdown'])) {
mysql_query("INSERT INTO num (id, ad, active)
VALUES ('1', 'Test',1)") or die(mysql_error());
}
and also this is what i found http://pastebin.com/Qwz3Zqtt , works fine but i don't know how to put them together.
any helps would be appreciated.
Thanks

Answer 1

You're going to want to learn basic ajax to process the database request. jQuery has a very easy to use implementation.
The basic code could be something like:
<script>
function updateTimer(seconds){
var countdown = document.getElementById('countdown');
countdown.innerHTML = "Please wait " + seconds + " seconds.";
}
var timer = function() {
var seconds = 10;
var interval = setInterval(function(){
if (seconds <= 0){
countdown.innerHTML = "Finished.. Updating Database";
// AJAX request here
clearInterval(interval);
}else{
updateTimer(seconds);
--seconds;
}
}, 1000);
updateTimer(seconds);
--seconds;
}
document.getElementById('start').addEventListener('click', timer);
</script>
<div id="countdown"></div>
<button id="start">Click Me</button>
Here's a fiddle

Answer 2

Use jQuery ajax
Simplest example:
if (ss<0) {
$.ajax('update.php?countdown='+countdown);
}