AJAX Timer control in VB.NET

In this article we will learn how to use Timer control in ASP.NET.
  • 2433

In this article we will learn how to use Timer control in ASP.NET.

Timer control

Timer control is a very important control. Timer control are used to refresh the page at a given interval of time. Timer control fires its Tick event. you can update a single region of a page whenever the Timer control fires tick event.

Properties: These are the following properties of the timer control.

timer.gif

Figure 1

Interval - The duration between tick events in milliseconds.

1 second = 1000 millisecond.

ID - Programmatic name of the control.

Enabled -enables raising of tick events.

For example:

Drag one scriptManager control, one UpdatePanel control and one Timer and two button control named as start and stop and one label control from the toolbox on the form. The form looks like this.

timer1.gif

Figure 2

Now click on the source button of the design form and add the following code.

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication29.WebForm1" %>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head id="Head1" runat="server">

    <title>How to Use AJAX Timer</title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

    <asp:ScriptManager ID="ScriptManager1" runat="server">

        </asp:ScriptManager>

    </div>

      <asp:UpdatePanel ID="UpdatePanel1" runat="server">

            <ContentTemplate>

                <br />

              <asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Size="XX-Large"

                    ForeColor="#0033CC"></asp:Label>

            </ContentTemplate>

            <Triggers>

              <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />

            </Triggers>

       </asp:UpdatePanel>

          &nbsp;&nbsp;

    <asp:Button ID="Button1" runat="server" Text="Start" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

    <asp:Button ID="Button2" runat="server" Text="stop" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

          <br /><br />

          <asp:Timer ID="Timer1" runat="server" Interval="1000"></asp:Timer>

    </form>

</body>

</html>

Now moves to design window and double click on the timer control and add the following code.

Protected Sub Timer1_Tick(ByVal sender As Object, ByVal e As EventArgs) Handles Timer1.Tick

        Label1.Text = DateTime.Now.ToString()

    End Sub

The above defines that interval property of the timer control is set on the 1000 millisecond. That means page will refresh after every 1 second.

When we set Enabled property as false on the stop button click event handler, which stops executing the timer tick event. when set Enabled property as true on the start button click event handler, which start executing the timer tick event. such as

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button1.Click

        Timer1.Enabled = True

    End Sub

    Protected Sub Button2_Click(ByVal sender As Object, ByVal e As EventArgs) Handles Button2.Click

        Timer1.Enabled = False

    End Sub

Now save and run the application. Page will be refresh after every second.

timer3.gif

Figure 3

Now click on the button stop to stop the executing timer tick events. and click on the start to start again execution.

Categories

More Articles

© 2013 dotNetheaven. All rights reserved.