www.developer.com/design/article.php/3691506
By Chris Schalk July 30, 2007 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.
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, |
| Go to page: Prev 1 2 3 4 5 6 Next |
Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia
Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers
, 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.