maandag, februari 05, 2007
ASP.NET: getting started with Ajax
It's here and it's free. Formely known as 'the Atlas project', Microsoft released the 1.0 version of their free ASP.NET Ajax add-on end of January. All you need to get started is on the ajax.asp.net site. AJAX essentially will allow you to build richer client interfaces for the web. For example, it will allow you to only update a part of a page instead of remaking the whole page for every single click.
Q: What are all those different downloads?
A: There are 3 downloads in total that are important.
A: Easy. Just download it here, and run the installation program. It will install the extentions on your hard disk (normally in the \Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025 folder). It will also install the extra controls in your Visual Studio 2005 toolbox, if installed. There is a good video on how to install the basic Ajax framework here. The major components are the ScriptManager and the UpdatePanel. You need to place one and only one ScriptManager control on every page you want to have Ajax functionality. And you use an UpdatePanel to mark a part of your page for partial updates. (Only what is in the UpdatePanel gets refreshed, the server doesn't need to waste its time on rebuilding the other parts of the page.)
Q: How to use the Ajax Control Toolkit?
A: There is a nice video describing the process here. You can download the toolkit from Codeplex. That is the place where you'll find the open source projects endorsed by Microsoft. There is a live preview site of all the controls in the toolkit on http://ajax.asp.net/ajaxtoolkit/. The toolkit does not have an installer. It comes as a .zip file, so you'll need to unzip it to your hard drive, for example also under the \Program Files\Microsoft ASP.NET\ folder. You will also need to manually add the controls to Visual Studio 2005. To do so, first make a new section in the toolbar: right-click and select 'Add new tab'. Give it any name, for example Ajax Toolkit. Then click right on that tab and select 'Choose Items...'.
On the next dialog box, Browse to the \Ajax Toolkit\SampleWebSite\Bin\AjaxControlToolkit.dll file (or where you unzipped it). This will add all the controls to your toolbox.
Q: How do the toolkit controls work?
A: You need to understand they are not controls on their own. They are extenders that add Ajax functionality to existing controls. For example, the TextBoxWaterMarkExtender will add a watermark to a textbox control, such as below. When nothing is typed in the box, your message shows. For most of the controls, there are excellent free videos here. Watch a few and you will get the hang of it. Then start experimenting and be amazed!
Q: What are all those different downloads?
A: There are 3 downloads in total that are important.
- The basic one is called the ASP.NET 2.0 Ajax Extensions. That is the 'official', released and supported version of the core Ajax functionality.
- The most useful one is the Ajax Control Toolkit. This is a collection of very useful, ready-to-use controls with Ajax behavior, such as watermarktextbox, hoovermenu, modal popup box, etc. They are created by an open source community that is supported by Microsoft.
- The Futures CTP. This is the beta of whatever functionality was not ready for the 1.0 release of the ASP.NET 2.0 Ajax Extensions. It is still in test and will be included in a later version. I'm not using this as I only want to use final and tested material.
A: Easy. Just download it here, and run the installation program. It will install the extentions on your hard disk (normally in the \Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025 folder). It will also install the extra controls in your Visual Studio 2005 toolbox, if installed. There is a good video on how to install the basic Ajax framework here. The major components are the ScriptManager and the UpdatePanel. You need to place one and only one ScriptManager control on every page you want to have Ajax functionality. And you use an UpdatePanel to mark a part of your page for partial updates. (Only what is in the UpdatePanel gets refreshed, the server doesn't need to waste its time on rebuilding the other parts of the page.)
Q: How to use the Ajax Control Toolkit?
A: There is a nice video describing the process here. You can download the toolkit from Codeplex. That is the place where you'll find the open source projects endorsed by Microsoft. There is a live preview site of all the controls in the toolkit on http://ajax.asp.net/ajaxtoolkit/. The toolkit does not have an installer. It comes as a .zip file, so you'll need to unzip it to your hard drive, for example also under the \Program Files\Microsoft ASP.NET\ folder. You will also need to manually add the controls to Visual Studio 2005. To do so, first make a new section in the toolbar: right-click and select 'Add new tab'. Give it any name, for example Ajax Toolkit. Then click right on that tab and select 'Choose Items...'.
On the next dialog box, Browse to the \Ajax Toolkit\SampleWebSite\Bin\AjaxControlToolkit.dll file (or where you unzipped it). This will add all the controls to your toolbox.
Q: How do the toolkit controls work?
A: You need to understand they are not controls on their own. They are extenders that add Ajax functionality to existing controls. For example, the TextBoxWaterMarkExtender will add a watermark to a textbox control, such as below. When nothing is typed in the box, your message shows. For most of the controls, there are excellent free videos here. Watch a few and you will get the hang of it. Then start experimenting and be amazed!
