hi all,
I have a problem in applying timer control on asp.net web pages.
in my web application i m having assessment pages, where i am retrieving question and answer from database.
everything is working fine but i want some kind of restrictions, like Assessment Time(20 Minute) so user can attempt question for specified time only.
there should be a time limit Time Limit In Assessment(Exam).
Can anyone help me? Deeply appreciated.
Cheerios
Store start time into the Session and get difference when a user submit his/her answer.
Store start time into the Session and get difference when a user submit his/her answer.
Thank you. This is my first time creating timer, i know is place on the page load however i not really sure what is the exact coding for it. Can you guide me?
Deeply appreciated.
Cheerios
Code might be.
In page_load handler,
if(Session["start"]==null)
{
Session["start"]=DateTime.Now;
}
DateTime dt=(DateTime)Session["start"];
TimeSpam ts= DateTime.Now - dt;
//Read TimeSpan's properties
......Code might be.
In page_load handler,
if(Session["start"]==null) { Session["start"]=DateTime.Now; } DateTime dt=(DateTime)Session["start"]; TimeSpam ts= DateTime.Now - dt; //Read TimeSpan's properties ......
Thank you so much. Could you translate the coding to vb? Sorry for asking so much questions as i'm still a beginner in asp.net. Thank you :)
If Session("start") Is Nothing Then
Session("start") = DateTime.Now
End If
Dim dt As DateTime = DirectCast(Session("start"), DateTime)
Dim ts As TimeSpam = DateTime.Now - dtLouis,
Your problem will be whether you intend on having a 'real-time' look and feel to your application or whether you want to check the actual time spent on the question AFTER the user submits the request to the server.
What adatapost has suggested will offer you server-side processing which may not be what you require - the time is set on the server and checked when the processing returns to the server again (after the user submits his/her question response). This has the unfortunate side-effect of the user being able to spend as long as they like on the questions but only being told they have taken too long when they click a button to submit their response or move on to the next question.
I suspect what you are looking for is a client-side timer script which counts down and keeps a track of the total time spent on the questions - this is quite intricate and will require some time invested by you on understanding its operation. I have such a script and will post it here is its what you require.
Please let us know what solution you are looking for...
Louis,
Your problem will be whether you intend on having a 'real-time' look and feel to your application or whether you want to check the actual time spent on the question AFTER the user submits the request to the server.
What adatapost has suggested will offer you server-side processing which may not be what you require - the time is set on the server and checked when the processing returns to the server again (after the user submits his/her question response). This has the unfortunate side-effect of the user being able to spend as long as they like on the questions but only being told they have taken too long when they click a button to submit their response or move on to the next question.
I suspect what you are looking for is a client-side timer script which counts down and keeps a track of the total time spent on the questions - this is quite intricate and will require some time invested by you on understanding its operation. I have such a script and will post it here is its what you require.
Please let us know what solution you are looking for...
The solution that i need to find might be the client-side timer script that you have mentioned. This is my first time creating timer and i not really sure do i need to do for the timer, i have tried google it but it seems that it does not work for my application. Could you post your script and guide me? Deeply appreciated. Thank you.
Essentially you need to start the timer server-side and then ensure that page refreshes do not alter the client-side countdown status (otherwise you just need to refresh constantly to reset the timer)
To invoke the timer I have the following:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{ TimerStart(); }
}The TimerStart routine is defined as:
private void TimerStart()
{
if (Session["TimerStart"] == null)
{
Session["TimerStart"] = true;
endDate = new BOL.Date();
}
}The Session settings is to prevent the page refreshes as mentioned earlier and the class BOL.Date is a class I have created to return the date from my SQL server, it allows me to break the date format down into year, month, day, hour, minute, seconds - if you don't have access to an SQL server you can use various methods to return this information easily.
The user can move to the next item in my list of items displayed without waiting for a full count down by pressing the 'Next Button', the code for this is as follows:
protected void btnNext_Click(object sender, System.EventArgs e)
{
Session["TimerStart"] = null;
TimerStart();
}To start the javascript timer, the following code needs to be added to the PreRender:
protected override void OnPreRender(EventArgs e)
{
if (Session["TimerStart"] != null)
{
string script = string.Format("javascript: countdownTimer({0}, {1}, {2}, {3}, {4}, {5}, {6});", endDate.Year, endDate.Month, endDate.Day, endDate.Hour, endDate.Minute, endDate.Second, <TimeValueInSeconds>);
ScriptManager.RegisterStartupScript(this, this.GetType(), "TimerStarted", script, true);
}
base.OnPreRender(e);
}The <TimeValueInSeconds> is exactly what it means - the time you are going to be counting down (in seconds)
Now for the HTML page...
I have added the following controls onto my HTML page:
<asp:Label ID="ClockID" runat="server" Text="Clock"></asp:Label>
<asp:Button ID="btnNext" runat="server" Text="Next Item" OnClick="btnNext_Click"/>The javascript is as follows:
<script type="text/javascript" language="javascript">
function countdownTimer(year, month, day, hour, minute, second, duration) {
var clockID = document.getElementById("<%=ClockID.ClientID%>");
var TimerTargetTime = new Date(year, month, day, hour, minute, second);
TimerTargetTime.setSeconds(TimerTargetTime.getSeconds() + duration);
TimerTargetTime.setMonth(TimerTargetTime.getMonth() -1);
countdown(clockID, TimerTargetTime.getFullYear(), TimerTargetTime.getMonth(), TimerTargetTime.getDate(), TimerTargetTime.getHours(), TimerTargetTime.getMinutes(), TimerTargetTime.getSeconds());
}
function countdown(clockID, year, month, day, hour, minute, second) {
Todays_Date = (new Date()).getTime();
Target_Date = (new Date(year, month, day, hour, minute, second)).getTime();
//Find their difference, and convert that into seconds.
Time_Left = Math.round((Target_Date - Todays_Date) / 1000);
if (Time_Left < 0) {
Time_Left = 0;
document.getElementById("<%=btnNext.ClientID%>").click();
return;
}
days = Math.floor(Time_Left / (60 * 60 * 24));
Time_Left %= (60 * 60 * 24);
hours = Math.floor(Time_Left / (60 * 60));
Time_Left %= (60 * 60);
minutes = Math.floor(Time_Left / 60);
Time_Left %= 60;
seconds = Time_Left;
dps = 's'; hps = 's'; mps = 's'; sps = 's';
//ps is short for plural suffix.
if (days == 1) dps = '';
if (hours == 1) hps = '';
if (minutes == 1) mps = '';
if (seconds == 1) sps = '';
var clockID = document.getElementById("<%=ClockID.ClientID%>");
clockID.innerHTML = days + ' day' + dps + ' ';
clockID.innerHTML += hours + ' hour' + hps + ' ';
clockID.innerHTML += minutes + ' minute' + mps + ' and ';
clockID.innerHTML += seconds + ' second' + sps;
//Recursive call, keeps the clock ticking.
setTimeout('countdown("' + clockID + '",' + year + ',' + month + ',' + day + ',' + hour + ',' + minute + ',' + second + ');', 1000);
}
</script>Once the timer times out it triggers the btnNext click event which moves on to the next item!
I do not claim to have written this code scratch but rather its a mixture of code I have found in various projects which I have cobbled together
The only issue with this timer function is that the client side Date() function could be totslly out of sync with the date you have started the timer with - this will lead to time differences being displayed on the countdown but its good enough for most purposes.
Further, I have only tested this in IE8 but I hope it helps!
Essentially you need to start the timer server-side and then ensure that page refreshes do not alter the client-side countdown status (otherwise you just need to refresh constantly to reset the timer)
To invoke the timer I have the following:
protected void Page_Load(object sender, EventArgs e) { if (!Page.IsPostBack) { TimerStart(); } }The TimerStart routine is defined as:
private void TimerStart() { if (Session["TimerStart"] == null) { Session["TimerStart"] = true; endDate = new BOL.Date(); } }The Session settings is to prevent the page refreshes as mentioned earlier and the class BOL.Date is a class I have created to return the date from my SQL server, it allows me to break the date format down into year, month, day, hour, minute, seconds - if you don't have access to an SQL server you can use various methods to return this information easily.
The user can move to the next item in my list of items displayed without waiting for a full count down by pressing the 'Next Button', the code for this is as follows:
protected void btnNext_Click(object sender, System.EventArgs e) { Session["TimerStart"] = null; TimerStart(); }To start the javascript timer, the following code needs to be added to the PreRender:
protected override void OnPreRender(EventArgs e) { if (Session["TimerStart"] != null) { string script = string.Format("javascript: countdownTimer({0}, {1}, {2}, {3}, {4}, {5}, {6});", endDate.Year, endDate.Month, endDate.Day, endDate.Hour, endDate.Minute, endDate.Second, <TimeValueInSeconds>); ScriptManager.RegisterStartupScript(this, this.GetType(), "TimerStarted", script, true); } base.OnPreRender(e); }The <TimeValueInSeconds> is exactly what it means - the time you are going to be counting down (in seconds)
Now for the HTML page...
I have added the following controls onto my HTML page:
<asp:Label ID="ClockID" runat="server" Text="Clock"></asp:Label> <asp:Button ID="btnNext" runat="server" Text="Next Item" OnClick="btnNext_Click"/>The javascript is as follows:
<script type="text/javascript" language="javascript"> function countdownTimer(year, month, day, hour, minute, second, duration) { var clockID = document.getElementById("<%=ClockID.ClientID%>"); var TimerTargetTime = new Date(year, month, day, hour, minute, second); TimerTargetTime.setSeconds(TimerTargetTime.getSeconds() + duration); TimerTargetTime.setMonth(TimerTargetTime.getMonth() -1); countdown(clockID, TimerTargetTime.getFullYear(), TimerTargetTime.getMonth(), TimerTargetTime.getDate(), TimerTargetTime.getHours(), TimerTargetTime.getMinutes(), TimerTargetTime.getSeconds()); } function countdown(clockID, year, month, day, hour, minute, second) { Todays_Date = (new Date()).getTime(); Target_Date = (new Date(year, month, day, hour, minute, second)).getTime(); //Find their difference, and convert that into seconds. Time_Left = Math.round((Target_Date - Todays_Date) / 1000); if (Time_Left < 0) { Time_Left = 0; document.getElementById("<%=btnNext.ClientID%>").click(); return; } days = Math.floor(Time_Left / (60 * 60 * 24)); Time_Left %= (60 * 60 * 24); hours = Math.floor(Time_Left / (60 * 60)); Time_Left %= (60 * 60); minutes = Math.floor(Time_Left / 60); Time_Left %= 60; seconds = Time_Left; dps = 's'; hps = 's'; mps = 's'; sps = 's'; //ps is short for plural suffix. if (days == 1) dps = ''; if (hours == 1) hps = ''; if (minutes == 1) mps = ''; if (seconds == 1) sps = ''; var clockID = document.getElementById("<%=ClockID.ClientID%>"); clockID.innerHTML = days + ' day' + dps + ' '; clockID.innerHTML += hours + ' hour' + hps + ' '; clockID.innerHTML += minutes + ' minute' + mps + ' and '; clockID.innerHTML += seconds + ' second' + sps; //Recursive call, keeps the clock ticking. setTimeout('countdown("' + clockID + '",' + year + ',' + month + ',' + day + ',' + hour + ',' + minute + ',' + second + ');', 1000); } </script>Once the timer times out it triggers the btnNext click event which moves on to the next item!
I do not claim to have written this code scratch but rather its a mixture of code I have found in various projects which I have cobbled together
The only issue with this timer function is that the client side Date() function could be totslly out of sync with the date you have started the timer with - this will lead to time differences being displayed on the countdown but its good enough for most purposes.
Further, I have only tested this in IE8 but I hope it helps!
Hello,
Sorry for my late reply had been busy doing this final year project. In order for the javascript timer to start, i have applied the coding that you have gave however it gave me some errors to it. As i'm using vb.net in my project therefore i need to change the above coding to vb.net.
protected override void OnPreRender(EventArgs e)
{
if (Session["TimerStart"] != null)
{
string script = string.Format("javascript<b></b>: countdownTimer({0}, {1}, {2}, {3}, {4}, {5}, {6});", endDate.Year, endDate.Month, endDate.Day, endDate.Hour, endDate.Minute, endDate.Second, <TimeValueInSeconds>);
ScriptManager.RegisterStartupScript(this, this.GetType(), "TimerStarted", script, true);
base.OnPreRender(e);
}
}This part have give me some errors that i can't change it to vb.net. Could you help me?
Thank you.
I syuspect it may be <TimeValueInSeconds>
Change it to 180 (for 3 minutes) or what ever time you want
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.