Introduction

Nowadays web isn't a web as it was 10 years ago. Web isn't a collection of static pages anymore. Actually, there was JavaScript and DHTML, but still web sites were far behind desktop applications in terms of interactivity. After the invention of AJAX it became possible to build really interactive web applications that are nearly the same as desktop applications except they are run in a browser.

Writing AJAX JavaScript code is a pretty routine task, so it's sensible to use a library that already has the necessary functionality. While Visual Studio 2008 has built-in ASP.NET AJAX 1.0 library, it doesn't contain many useful things we need when we are writing rich Internet applications.

ASP.NET AJAX Control Toolkit

ASP.NET AJAX Control Toolkit or simply ACT is a thing that can help to write rich Internet applications. Basically, it's set a of useful interactive web controls that we usually find in desktop applications, but missing in web applications. These controls include sliders, pop-up calendars, modal dialogs and many others. We don't have to write any JavaScript code to use them in our applications, we just need to use ACT controls that are very similar to ordinary ASP.NET controls.

ACT is run both by Microsoft and community, so everybody can take part in the creation of the decent AJAX toolkit.

Installation

The installation isn't difficult, but still worth mentioning.

First, you need to download the kit, go to their CodePlex page and choose the appropriate package. After downloading unpack the contents of the archive somewhere. Open Visual Studio, expand Toolbox, right-click, choose "Add Tab", name it "AJAX Control Toolkit", then right-click again within the space of the newly created tab and select "Choose Items...", click "Browse", open the folder where you extracted the contents of the archive, open "SampleWebsite\Bin\AjaxControlToolkit.dll". The tab must become populated with the controls. If you drag any control to a web form, the necessary assemblies will be copied to the "Bin" folder of the web site and the ACT assembly will also got registered on the page.

Controls

ACT provides two types of controls:

• Web controls
• Extenders

Web controls are just ordinary ASP.NET controls with some enhanced client-side functionality. Extenders are controls built on top of the existing ASP.NET controls with an additional client-side functionality, for example, many controls, for instance Slider, use TextBox and store their value in it.

An Example

Enough with the theory, let's do something practical, for example, let's try the Slider control.

Drag Slider from Toolbox onto your page.

Since, Slider is an extender and it extends TextBox, you should add a TextBox and add the TargetControlID attribute to the Slider:

<asp:TextBox ID="txtSlider" runat="server" />
<cc1:SliderExtender
  ID="SliderExtender1"
  runat="server"
  TargetControlID="txtSlider"
/>

Don't forget to add ScriptManager to the page, because the page won't compile without it. You can compile it now and drag the slider. Unfortunately, it doesn't show the current value. You need to add a bound control, add Label next to the TextBox and set the BoundControlID of the SliderExtender:

<asp:TextBox ID="txtSlider" runat="server" />
<asp:Label ID="lblSlider" runat="server" />

<cc1:SliderExtender ID="SliderExtender1" runat="server" TargetControlID="txtSlider"
    BoundControlID="lblSlider" />

Now when sliding it you can see the value.

You can set the minimum value with the Mininum attribute, the maximum value with the Maximum attribue and the number of steps with the Steps attribute.

Conclusion

If you need to add some rich functionality to your web application, then you should consider using ASP.NET AJAX Control Toolkit that is still in its community sandbox, however as many projects that were marked as beta it can be shipped with the new versions of Visual Studio and become an integrated part of the further .NET Framework releases.

I recommend you to check this page where you can find all the examples and the documentation of every control available in the kit.