In this Example we will see how
to create stop watch in asp.net. When click on start then it will start
automatically when we pause then time will pause and when we click on start
then it will automatically start from previous time. In many project people
need like this controls or widget. Here we will create like this in dot net.
Design your webpage like below. Here we will use timer controls for
start time and stop timer controls. Using script we will call this controls in
button event.
HTML CODE:
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div style="margin-left:160px">
<table class="style1">
<tr>
<td class="style2">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server"
Enabled="false"
Interval="1000"
OnTick="Timer1_Tick"></asp:Timer>
<asp:Label ID="lblmin2"
runat="server"
Text="0"></asp:Label>
<asp:Label ID="lblmin1"
runat="server"
Text="0"></asp:Label>
<asp:Label ID="Label3" runat="server"
Text=":"></asp:Label>
<asp:Label ID="lblsec2"
runat="server"
Text="0"></asp:Label>
<asp:Label ID="lblsec1"
runat="server"
Text="0"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</td>
<td>
<asp:Button ID="btnstart" runat="server" OnClientClick="startTimer()" Text="Start" Width="160px" OnClick="Button1_Click" />
</td>
</tr>
<tr>
<td class="style2">
</td>
<td><asp:Button ID="btnpause" runat="server" Text="Pause" OnClientClick="stopTimer()"OnClick="Button2_Click" Width="76px" />
<asp:Button ID="btnreset" runat="server" Text="Reset" OnClick="Button3_Click" Width="79px" />
</td>
</tr>
</table>
</div>
</form>
<script type="text/javascript">
function
startTimer() {
return
$find('Timer1')._startTimer();
}
function
stopTimer() {
return
$find('Timer1')._stopTimer();
}
</script>
</div>
Now code for when you want to start timer control and when you want to
stop timer controls. Or save in minutes, hours in your timer controls.
public int time_second;
public int time_min;
protected
void Page_Load(object
sender, EventArgs e)
{
if
(!IsPostBack)
Timer1.Enabled = false;
}
protected
void Button1_Click(object
sender, EventArgs e)
{
Timer1.Enabled = true;
btnpause.Visible = true;
btnreset.Visible = true;
}
protected
void Timer1_Tick(object
sender, EventArgs e)
{
time_second = int.Parse(lblsec1.Text);
time_second = time_second + 1;
lblsec1.Text =
time_second.ToString();
if
(lblsec1.Text == "10")
{
lblsec2.Visible = false;
}
if
(lblmin1.Text == "10")
{
lblmin2.Visible = true;
}
if
(lblsec1.Text == "60")
{
lblsec2.Visible = true;
time_min = int.Parse(lblmin1.Text);
lblsec1.Text = "0";
time_min = time_min + 1;
lblmin1.Text =
time_min.ToString();
}
}
protected
void Button2_Click(object
sender, EventArgs e)
{
Timer1.Enabled = false;
}
protected
void Button3_Click(object
sender, EventArgs e)
{
time_second = 0;
time_min = 0;
lblmin1.Text = "0";
lblsec1.Text = "0";
lblsec2.Visible = true;
Timer1.Enabled = false;
}
Run you web application and see you will get timer controls or else
stop watch.
Thanks for comments.....