That's correct, you must use javascript to do that, either with ajax or japascript, i have a complete example that uses a countdown timer to control the time a user have to answer a question, you can see it at:
Trivia Game
In this example i use a combination of php, javascript and a HTML Template to output the related choices of any questions that are stored in a MySql database and other stuff.
Apart from the registration process It works following this sequence:
- Check User: if the user that tries to play is a registered user and if this user is logged in, if not redirects to the login page.
- Check plays per day: Verify how many times a user plays the Trivia per day, no one can play more than 5 times per day, this value is configurable.
- Check questions per test: Verify the number of questions played per test, also this value is configurable and if the user reach the max number of questions finish the play and compute and store the results.
- Load Template: Verify if the template file can be opened, if not the script finish otherwise continue and stores the file in a temporary variable.
- Calculate number of questions.
- Pick and populate a random question.
- Select and populate the question's related choices.
- Build form's output for the choices using radio inputs.
- Get and set the initial time for the timer.
- Build some hidden fields especially the one for the count down timer.
- Replace the result value of the template that will be showed if a question have already answered.
- Replace the values of the template with all the data obtained before.
- Finally show the output to the user.
Something very important is that the template file -a HTML file- includes the necesary javascript code that controls the timer, without it, it dont work fine, also this file includes the design layout, the form's tag, a submit button and a simple input text box that dynamically shows how many seconds are left, when this time reach 0 or when the user press the submit button simply process the question and computes the results, then goes or to the next question or finishes the played test.
This is the code for the timer located in the template file between the form tag:
Time Left: <input type="text" name="seconds" size="3">
<script type="text/javascript">
var myTime = 20;
function countDown() {
document.form.seconds.value = myTime;
if (myTime == 0) {
idq=document.form.idquestion.value;
for (i=0;i<document.form.answer.length;i++) {
if (document.form.answer[i].checked==true) {
ida=document.form.answer[i].value;
}
}
location.href="trivia1.php?idquestion="+idq+"&answer="+ida;
}
else if (myTime > 0) {
myTime--;
setTimeout("countDown()",1000);
}
}
countDown();
</script>