Beginning Ajax with Visual Studio 2005

Developing Ajax Websites using Visual Studio 2005 is actually not difficult to learn. Firstly, you have to install a copy of Visual Studio 2005 and install the ASP.NET AJAX Extensions 1.0 from here.

How to create an AJAX website using Visual Studio 2005?

In Visual Studio 2005, select New > Web Site > ASP.NET AJAX ENABLED WEBSITE as shown below.

If you look in the toolbox, you will see AJAX Extensions. What we will do now is to create a simple Timer Ajax page in Visual Studio.

The following line will be automatically created in Default.aspx. By default in ASP.NET AJAX, all AJAX code will run at the server. You can create client AJAX applications in Visual Studio 2005 but that is not covered in this example.

All the AJAX Timer control from the AJAX Extensions toolbox by dragging and dropping it onto the Design page of Default.aspx. If you look in the source, it will like this:

The Timer control runs at the server and you set the interval value to tell the program how often to trigger the OnTick event. The interval value is measured in milliseconds. You have to tell the program what to when the OnTick event is triggerred. In this case we point it to a function called Timer_Tick. Below is an example of the source of the Default.aspx page.

Here you will notice additional tags in the Default.aspx page such as:

Let me explain what the tags mean in this example. The GridView control is added because we want the GridView to be updated every time the OnTick event is fired. Because it is an ASP.NET AJAX application, we have to include the tag and wrap the and GridView within updatepanel. The OnTick event will update the control within the updatepanel.

Now let’s take a look at the code-behind for the Timer_Tick code. An example is shown below. You can basically code anything you want in Timer_Tick. All it does it carry out what is coded within the function when the OnTick event is fired. In this example it calls BindGrid() which connects to the database, fetches a recordset and binds it to the GridView.

I’ve use the Timer example because it is something I used in one of my project at work. The management wanted a simple web page that would refresh itself at a fixed interval to show the location of service engineers. I used a combination of the AJAX Timer control and GridView control to display the data as requested.

This concludes my first example of beginning AJAX with Visual Studio 2005.

For other Visual Studio and GridView examples that might interest you, click here.