zondag, januari 14, 2007
Ajax Rating Control
This weekend, I played with Ajax on my "toy" project 6C Quotes. More specifically, I added a star rating control to the site. You can see the differences for yourself:
- http://www.about2findout.com/6CQuotes/default.aspx is the 'normal' page
- http://www.about2findout.com/6CQuotes/defaultajax.aspx is the 'ajax' page
The quote (pink area) is now an autonomeous update panel. That means if you refresh the quote, only the pink square is refresed, and the rest of the page is not reloaded by a server round trip. That also means when you click the 'New Quote' button, you stay where you were on the page. The star rating control itself is part of the upcoming Microsoft ASP.NET Ajax Control Toolkit.
So what did I find out that I wanted to share?
- The start place for AJAX on an ASP.NET platform is the site http://ajax.asp.net . There are two parts you need do download and install. First of all the Ajax framework extention itself. This is the core functionality (codename ATLAS) made and supported by Microsoft. It is currently in release candidate 1 and will ship soon. Secondly the Ajax Control Toolkit. This is a set of ready-to-use controls that are built upon the framework and created by an open source community (so not Microsoft itself). It's a combination that seems to work.
- For the rating control and basic information on ajax on asp.net, have a look at the free video tutorials on asp.net (free) or on aspalliance.com (free registration). Highly recommended! I think they are made with Camtasia Studio, but I'm not sure.
- If you want to AJAX-enable existing asp.net applications, you need to add these lines in the web.config file (see attachment webconfigcode.txt)
- You also need to add the AjaxControlToolkit.dll in the \bin folder of your application. If your hosting provider hasn't installed the Ajax extentions on the server yet, you also need the core framework DLLs (System.Web.Extentions.dll) in that \bin folder.
- .PNG image files don't work in a transparant way in most browsers, so I chose some .GIF star images
- I couldn't figure out how to have a message 'Thank you for rating' without adding an extra button and adding a server round-trip. I don't want to add another button, users already need to click a lot.
- The System.Math.Round() function doesn't round properly, or at least not how I would like it to. (Which is how I learned it in school.) For example, it rounds 4.66 to 4. So I made my own rounding formula.
I want to use the Ajax controls on about2findout.com, so I need to play around with them. It's a slow start to implement one feature like star rating on an entire sunday, but I need to get the basics first. So far, Ajax seems a nice technology.
- http://www.about2findout.com/6CQuotes/default.aspx is the 'normal' page
- http://www.about2findout.com/6CQuotes/defaultajax.aspx is the 'ajax' page
The quote (pink area) is now an autonomeous update panel. That means if you refresh the quote, only the pink square is refresed, and the rest of the page is not reloaded by a server round trip. That also means when you click the 'New Quote' button, you stay where you were on the page. The star rating control itself is part of the upcoming Microsoft ASP.NET Ajax Control Toolkit.
So what did I find out that I wanted to share?
- The start place for AJAX on an ASP.NET platform is the site http://ajax.asp.net . There are two parts you need do download and install. First of all the Ajax framework extention itself. This is the core functionality (codename ATLAS) made and supported by Microsoft. It is currently in release candidate 1 and will ship soon. Secondly the Ajax Control Toolkit. This is a set of ready-to-use controls that are built upon the framework and created by an open source community (so not Microsoft itself). It's a combination that seems to work.
- For the rating control and basic information on ajax on asp.net, have a look at the free video tutorials on asp.net (free) or on aspalliance.com (free registration). Highly recommended! I think they are made with Camtasia Studio, but I'm not sure.
- If you want to AJAX-enable existing asp.net applications, you need to add these lines in the web.config file (see attachment webconfigcode.txt)
- You also need to add the AjaxControlToolkit.dll in the \bin folder of your application. If your hosting provider hasn't installed the Ajax extentions on the server yet, you also need the core framework DLLs (System.Web.Extentions.dll) in that \bin folder.
- .PNG image files don't work in a transparant way in most browsers, so I chose some .GIF star images
- I couldn't figure out how to have a message 'Thank you for rating' without adding an extra button and adding a server round-trip. I don't want to add another button, users already need to click a lot.
- The System.Math.Round() function doesn't round properly, or at least not how I would like it to. (Which is how I learned it in school.) For example, it rounds 4.66 to 4. So I made my own rounding formula.
I want to use the Ajax controls on about2findout.com, so I need to play around with them. It's a slow start to implement one feature like star rating on an entire sunday, but I need to get the basics first. So far, Ajax seems a nice technology.
