Creating a web app, then adding AJAX to it?

Question

I imagine there are many of you out there who have developed an app online which automates a lot of processes and saves people at your company time and money.

The question is, what are your experiences with developing that app, having it all set in place, then "spicing" it up with some AJAX, so it makes for a better user experience?

Also, what libraries would you suggest using when adding AJAX to an already developed web app ?

Lastly, what are some common processes you see in web apps that AJAX does well with? For example...auto-populating the search box as you type.

Answer 1

If you are using ASP.NET to write your applications, adding AJAX using ASP.NET AJAX is very straightforward and in many places will not require you to change any code at all except add two controls to the pages you want to modify.

This works using partial page loads. The controls you have to add (off the top off my head) are called something like

<asp:ScriptManager

and

<asp:UpdatePanel

Answer 2

It doesn't really matter which you use, unless you're trying to do something very specialized.

Here's a good list: http://code.google.com/apis/ajaxlibs/.

Yes, auto-completers are a pretty handy implementation of Ajax. It's also quite useful for data-intensive activities like populating drill-down data.

A lot of what you can do with these libraries isn't Ajax-specific, there is a lot of UI interaction that can benefit the user as well. You can do things like slideshows and lightboxes quite easily with many of these libraries.

Pick the one that you're comfortable with. The syntax they all use is a little different. Give a few a spin and try to build simple examples. Stick with the one you like.

Answer 3

My preferred way of building AJAX-enabled applications is to build it the old fashioned way where every button, link, etc posts to the server, and then hijack all those button, link, etc clicks to the AJAX functionality.

This ensures that my app is down-browser compatible, which is good.

Answer 4

The biggest thing I use for AJAX is lists and search forms. Why? Because the overhead of loading an entire page when you are going though a list of, let's say, 200 records, it will get frustrating for a user to go though everything. However, it is important that if you click on a link in the page and then hit the back button or use a link at the top to return to the same page you were on.

For search forms, as you fill out the form I use AJAX queries to return the first few results and a number indicating how many records that were returned.

For AJAX frameworks, I use mootools. http://www.mootools.net.

Answer 5

Using ASP.NET Ajax to wrap a few chunks of code is an easy way to get going. But personally I prefer to use jQuery. You can easily add some simple Ajax calls with it to make the UI more responsive without the ASP.NET Ajax overhead.

Answer 6

I would differ from the first poster. Adding ajax isnt always as easy as 1,2,3. It really depends on what you are after.

Adding things such as a colour animation can be made fairly easy, but if you are after things such as auto populating a text box, this requires extra code. Its not as easy as adding just something client side. you would also need to add in server side support to fetch the partial query results.

Going beyond that it can become even more complex keeping your client side script in sync with server side support.

But with the spirit of simplicity in mind there are libraries you can use to 'spice' up a website with animations and other eyecandy that can be implemented fairly easily which have been mentioned already.

Answer 7

Please ignore if not using ASP.NET. Your platform wasn't clear from your question.

Depending on when you created your web application, your web config file may need some tweaks to use ASP.NET Ajax. The easiest way to see is to create a new web site with the ASP.NET Ajax template and compare the web config, copying over configuration items as needed to bring the old one up to date.

Answer 8

If "spicing it up" is all you're after then develop the fully functional app without Ajax first. From here you can unobtrusively add ajax functionality and ensure that the app degrades well for non javascript-enabled browsers.

I've started using jquery for javascript on my site. It takes away all the worry of cross browser javascript differences; things like class and classname, and getElementById. It also includes some very handy and simple functionality for ajax postbacks. It's very easy to learn and extremely lightweight when used well.

I've seen some good use of ajax right here on stack overflow; things like the tag selector, and the question lookup when you type a question title. I think these simple things work best; we're just adding to the user experience with small additions to functionality that are intuitive, we're not flooding the screen with drag/drop handles etc.

Answer 9

I've often had to Ajax-enable an old-fashioned asp.net 2.0 site. The easiest way I've found to do that is to create a new Ajax-enabled site and copy and paste certain sections of the web.config into your old project's web.config. Just compare the two and see what's missing in your old one. You'll obviously also need to add references to AjaxExtensions and AjaxControlToolkit.