Ajax Search 2.0
Jul 28, 03:57 PM By Eoghan O'Brien.Hey, I’ve being playing around with Scriptaculous and Prototype recently, and decided to revamp the Ajax Search I posted before.
I’ve used some Scriptaculous Effects for animating the Search Results instead of just popping them up and have added a more user friendly Search Results page for users without Javascript. Take a look at the newer version here
Creating Ajax App using Scriptaculous and Prototype is absolutely simple once you understand the basic concepts of XMLHttpRequests. There’s a vast library of properties and methods available that make developing with Ajax absolutely painless and actually a lot of fun.
Prototype: The $ selector
One of the most useful features of Prototype is the dollar selector which is a very simple way of getting elements by their Id just by using the $ sign. It cuts down on a lot of the verbose code which you would normally have to deal with especially when developing large scale apps.
Usage
Prototype:
var myDiv = $(‘my_div’);
Normal DOM Method:
var myDiv = document.getElementById(‘my_div’);
Scriptaculous: Easy Effects
I was a little afraid about looking into the Scripaculous framework at first, mainly because I thought there would be a lot to learn just to use it. This however was not the case at all! I immediately fell head over heels in love with it and its simplicity.
Quick Usage Examples
Make a Div Appear:
<a href="#" onclick="new Effect.Appear('my_div')">Show Div</a>
<div id="my_div">
I'm 'my_div'
<div>How easy is that! Go here for an exmaple.
XHTML 1 Strict 
Valid CSS 2.0