How to use AJAX Timer Control in ASP.NET using C# with Example and Source Codes

3 Comments | 7855 Views | Post by: Admin | Tags: ASP.NET Ajax Timer Control, ajax timer control example, asp.net ajax sample, ajax controls in asp.net with examples, how to use ajax timer control in asp net, timer control in asp net


Here Pawan Kumar will explain, How AJAX Timer Control in ASP.NET using C# with screenshot and detailed example. This will help the beginners to learn and implement and make use of very useful ASP.NET AJAX Timer Control.


Introduction:
Here Pawan Kumar will explain, How  AJAX Timer Control in ASP.NET using C# with screenshot and detailed example. This will help the beginners to learn and implement and make use of very useful ASP.NET AJAX Timer Control.

Description:
In previous post I explained How can we Insert, Update, Delete Records in ASP.NET Server Control ListView in ASP.NET with C#, How to Convert Numbers to Words String in ASP.NET using C#, Set meta tag in asp.net programmaticaly for creating seo friendly websites,How to validate or check whether checkbox is checked or not using ASP.NET and jQuery with example.

Now in this article, I will introduce you to the AJAX Timer Control. This Control can be used to initiate a refresh of an UpdatePanel in a certain timeframe. One important thing to know using ASP.NET Timer Control we are also able to refresh the entire page . This simple examples illustrates how the Timer Control works and how to implement it.

So follow the steps to learn and use the ASP.NET Timer Control with Update Panel in ASP.NET using C#

Step 1: First, we start by creating an Empty ASP.NET web site in Visual Studio .NET 2010. The AJAX Extensions (from Microsoft) make it a whole lot easier to create AJAX web pages


http://www.sourcecodehub.com/articleimages/ajax-timer-control-in-aspnet/Create-website-visual-studio-1

Create-website-visual-studio-new-website2


Step 2: Create an ASPX Page for Right Click on Solution Explorer > Add Items > Web > Webform and save it as "Default.aspx".When we first open our Default.aspx page

add-new-webform-visual-studio-3

add-new-webform-visual-studio-add-name4


Step 3: Add the ScriptManager(remember there should be always one ScriptManager on ASPX page) from the page.

"ScriptManager1" runat="server" />


Next, we will also add "Timer" control and "UpdatePanel" from the TOOLBOX > AJAX EXTENSIONS. The code will loks like below
 


 
"form1" runat="server"> "ScriptManager1" runat="server" /> "server" id="Timer1" interval="5000" ontick="Timer1_Tick" /> "server" id="TimePanel" updatemode="Conditional"> "Timer1" eventname="Tick" /> "server" id="Label1" />

 

add-script-manager-5

Step 4: Complete Source Code for "Default.aspx" page

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

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

"http://www.w3.org/1999/xhtml">"server">

"form1" runat="server">
"ScriptManager1" runat="server"> "server" ID="Timer1" Interval="5000" OnTick="Timer1_Tick" /> "server" ID="TimePanel" UpdateMode="Conditional"> "Timer1" EventName="Tick" /> "server" ID="Label1" />


Please pay attention to the "ontick" and "interval" attributes of the Timer Control. The interval is in milliseconds, so every 5 seconds, the "UpdateTimer_Tick" method will be called.
Also note the "eventname" attribute of the Trigger. This tells the page what is going to cause (or trigger) the UpdatePanel to update.

Step 5: Finally, we will add logic to the code-behind. We are simply going to tell it to display the current time in a Label. This way we can see exactly when the UpdatePanel is being refreshed.

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void Timer1_Tick(object sender, EventArgs e)
    {
        Label1.Text = DateTime.Now.ToString();
    }
}


Step 6: Run the Application or Press "F5" on the keyboard.. Output will like similar below:-

 

output1

output2



Conclusion:
So, In this tutorial we have learned, How to use AJAX Timer Control in ASP.NET using C# with detailed explanation.
 

Download Source Codes


Post Comments

if you have some suggestion, question, request on How to use AJAX Timer Control in ASP.NET using C# with Example and Source Codes.

Please use the comment box to express your views.

 

Comments:

loading...