Using the Yahoo Web Service | JavaScript Phrasebook

Using the Yahoo! Web Service

<script language="JavaScript" type="text/javascript"   src="/books/3/490/1/html/2/http://api.search.yahoo.com/WebSearchService/ V1/webSearch?appid=XXXXX&query=JavaScript&output= json&callback=showResults"> </script>

More and more Web Services provide a JSON interface, and among the first ones to do so were the Yahoo! Web Services. After a (free) registration at http://api.search.yahoo.com/webservices/register_application, you get your personal application ID. This ID is tied to your application and must be used instead of the XXXXX placeholder in this phrase. Then, the preceding <script> tag not only calls the Web Service and expects JSON back, but also provides the name of a callback function that is called after the data is there. So your application receives JavaScript code from the Yahoo! server and executes itwhich means you have to trust Yahoo! in order to use it. Then, the callback function gets a JavaScript object with the Yahoo! search results.

The following code then creates a bulleted list with the data from the Web Service. More information about the specific format of the data returned from Yahoo! can be found at the online documentation at http://developer.yahoo.com/search/web/V1/webSearch.html. Figure 11.6 shows the output of this code.

Calling the Yahoo! Web Service with JavaScript (yahoowebservice.html)

[View full width]

<script language="JavaScript"   type="text/javascript"> function showResults(data) {   var ul = document.getElementById("output");   for (var i=0; i < data.ResultSet.Result.length; i++) {     var text = document.createTextNode(       data.ResultSet.Result[i].Title + " - " +       data.ResultSet.Result[i].Url);     var li = document.createElement("li");     li.appendChild(text);     ul.appendChild(li);   } } </script> <body>   <p><ul ></ul></p> </body> <script language="JavaScript" type="text/javascript"   src="/books/3/490/1/html/2/http://api.search.yahoo.com/WebSearchService/V1 /webSearch?appid=XXXXX&query=JavaScript&output=json&callback=showResults"> </script>

Figure 11.6. The Yahoo! search results.

Using an AJAX Framework

The more AJAX you are using on your website, the more you should look into available AJAX frameworks that can facilitate working with XMLHttpRequest and other advanced JavaScript features.

Which framework to choose depends largely on the server-side technology that is used. There are several AJAX frameworks for both Java (for example, Zimbra, at http://www.zimbra.com/) and ASP.NET 2.0 (for example, Atlas, at http://atlas.asp.net/); PHP knows too many frameworks to mention (including the PEAR package at http://pear.php.net/package/HTML_AJAX).

Quite interesting are also technology-independent AJAX frameworks that rather focus on the JavaScript side of things. Dojo, especially (http://www.dojotoolkit.org/), is worth mentioning, since it offers workarounds similar to those mentioned in this chapter to make the back and forward buttons work again.

One of the oldest frameworks, by the way, is considered to be Tibet (http://www.technicalpursuit.com/), which started being worked on (at least conceptually) in 1997 and saw its first release in 1999.

So choose your framework wisely depending on the server-side technologyare you exclusively using one server technology, or are you more customer driven? Depending on this information, the features of the various frameworks, and especially the development activity (since many projects never really get off the ground or stall after some months), you pick a framework; but quite often the phrases in this chapter will give you all you need to turn your web application into an AJAX application.