Friday, May 23, 2008

Ajax .Net I : Extension Controls in Visual Studio 2008

In this blog we are going see Script Manager, UpdatePanel and Timer in Action. I will demnostrate creating an Digital clock in the site.

Start a new ASP .Net Website.

Visual Studio comes with 5 Ajax Extension controls as shown below.

Drag a ScriptManager to the form.
Below the ScriptManager add an UpdatePanel.
ScriptManager is responsible for delivering scripts to the Browser
In Ajax .Net Partial Page update is made possible using UpdatePanel.
Add a Label and an Ajax Timer Control Ajax Controls into the UpdatePanel. Set the Enabled property to True and Interval to 1000 (milliseconds) for the Timer Control.

Double click on the Timer control you will be taken to Tick Event of Timer.
Write the code to display the current time as shown below:

protected void Timer1_Tick(object sender, EventArgs e)
lblTime.Text = System.DateTime.Now.ToString("T");

Run the application you will see that the time is getting updated without the web page making a postback to the server.

Related Blog

Ajax .Net II : Setting up Ajax Control Toolkit controls

Ajax .Net III : CalendarExtender Control

Ajax .Net IV : TextBoxWaterMarkExtender

Ajax .Net V : FilteredTextBoxExtender

Ajax .Net VI : ConfirmButtonExtender

No comments:

Post a Comment