I am using asp.net 3.5 with C#. I want to create a countdown timer and my requirement is like this:
Countdown end date: June 16 2010 So, till June 16 comes my timer will show the remeaning time.
Please let me know how to achieve it, I google it but i didn't get the excat solution to my problem.
Thanks in advance.
This is something you need to solve with Javascript. The only thing you need to do from the server is set the end date as a Javascript variable. You need Javascript because you only load the page from the server. Afterwards you need to handle the countdown on the client.
Javascript
<script type="text/javascript">
function countdown_clock(clockID, year, month, day, hour, minute) {
countdown(clockID, year, month, day, hour, minute);
}
function countdown(clockID, year, month, day, hour, minute) {
Today = new Date();
Todays_Year = Today.getFullYear();
Todays_Month = Today.getMonth();
//Convert both today's date and the target date into miliseconds.
Todays_Date = (new Date(Todays_Year, Todays_Month, Today.getDate(),
Today.getHours(), Today.getMinutes(), Today.getSeconds())).getTime();
Target_Date = (new Date(year, month - 1, day, hour, minute, 00)).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;
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 clock = document.getElementById(clockID);
clock.innerHTML = days + ' day' + dps + ' ';
clock.innerHTML += hours + ' hour' + hps + ' ';
clock.innerHTML += minutes + ' minute' + mps + ' and ';
clock.innerHTML += seconds + ' second' + sps;
//Recursive call, keeps the clock ticking.
setTimeout('countdown("' + clockID + '",' + year + ',' + month + ',' + day + ',' + hour + ',' + minute + ');', 1000);
}
</script>
ASP.NET
protected override void OnPreRender(EventArgs e)
{
DateTime endDate = new DateTime(2010, 6, 1, 0, 0, 0);
string script = string.Format("countdown_clock('clock', {0}, {1}, {2}, {3}, {4});", endDate.Year, endDate.Month, endDate.Day, endDate.Hour, endDate.Minute);
ScriptManager.RegisterStartupScript(this, this.GetType(), "countdown", script, true);
base.OnPreRender(e);
}
Script taken an modified for example purpose from My Little Scripts.
If you like it easy, use DateTime.
DateTime EventTime = new DateTime(2010, 6, 16);
TimeSpan Duration = EventTime - DateTime.Now;
string TimeTillEvent = Duration.ToString();
