In reviewing this code example, you first note that an external JavaScript file, uds.js, is downloaded into the page. The uds.js file provides some of the behind-the-scenes plumbing for enabling the search mechanism into your page. Notice that, to download this file, an API key is passed as an argument to the host providing the JavaScript file.
| Note: In the above example, YOUR-KEY would be replaced with the one generated for you. |
In addition to including the core uds.js file into the page, an additional bit of custom JavaScript is needed to specify some specifics such as what type of search mechanism and some additional settings such as how to render itself on the page.
Notice the first line of code:
var searchControl = new GSearchControl();
It first creates a new base GSearchControl class. The next bit of code adds specific searcher options to the base control. As you can see, searchers for Local, Web, Video, Blog, News, and Book are added to the search control by using:
var localSearch = new GlocalSearch();
searchControl.addSearcher(localSearch);
searchControl.addSearcher(new GwebSearch());
searchControl.addSearcher(new GvideoSearch());
searchControl.addSearcher(new GblogSearch());
searchControl.addSearcher(new GnewsSearch());
searchControl.addSearcher(new GbookSearch());
And finally, to execute an initial search as the page is loaded, the line:
GSearch.setOnLoadCallback(onLoad);
is used to execute the "onLoad( )" function that both initializes the search controls and executes an initial search using:
searchControl.execute("VW Beetle");
This results in the page rendering with an initial set of search results.
Figure 1: A HelloWorld AJAX Search
Notice the search results are nicely formatted with collapsible sections. There are also clickable icons that allow you to alter the appearance and behavior of the results.
Figure 2: AJAX Search customizable formatted results
The results number icon, 
, allows you to define how many results you want displayed ranging from 1, 4 to 8. The search options icon, 
, allows you to specify further search or reporting options such as changing the local search location, or how to sort the results, such as by date. The "X" to the right of the main search button allows for cancelling a search before it completes.
IE 7
Firefox 2.0
