Hey guys!
I am trying to get this countdown timer to work and trying to add a form tag that will process the timer result to be used in php but I get undefined index timer error. Here is the code for the timer:
<?php
$timer = 60;
$result = $_POST['timer'];
echo $result;
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
</head>
<body>
<script>
var timer = <?php echo $timer ?>; // 1 minute timer....
var min = 0;
var sec = 0;
function startTimer() {
min = parseInt(timer/60);
sec = parseInt(timer%60);
if(timer<1) {
document.write("You have to start again!");
}
document.getElementById("time").innerHTML = + min.toString() + ":" + sec.toString();
timer--;
setTimeout(function() {
startTimer();
}, 1000);
}
function stopTimer() {
alert("Thank you for completing the test. You finished the test at: " + min.toString() + ":" + sec.toString());
var result = document.getElementById('time').innerHTML;
document.getElementById('input').value = result;
// window.location.href = "update.php";
}
</script>
<form>
<div class="timer">
<h1>Welcome to Timertrone.</h1>
<br></br>
<form action="" method="POST">
<b>Time Left: </b> <span class="timer_display" id="time"> ...</span>
<input type="text" name="timer" id="input">
<h1 id="buttons"></h1>
<button type="button" name="start" onclick="startTimer()">Start</button>
<button type="button" name="stop" onclick="stopTimer()">Stop</button>
<button type="submit" name="submit" >Submit</button>
</form>
</div>
</div>
</body>
</html>