4.7. Putting Everything Together

For a more realistic example, we combine the web service accessed earlier with Scriptaculous drag-and-drop and effects.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Script-Type" content="text/javascript"/> <title>Ajax exchange rates</title> <script src="js/prototype.js" ></script> <script src="js/scriptaculous.js"></script> </head> <body> <P> Drag and drop countries to get exchange rates</P> <div id="US" class="country cdropTarget cdragTarget"><P>US</P></div> <div id="UK" class="country cdropTarget cdragTarget"><P>UK</P></div> <div id="france" class="country cdropTarget cdragTarget"><P>France</P></div> <div id="germany" class="country cdropTarget cdragTarget"><P>Germany</P></div> <script type="text/javascript"> var SOAP_URL = "http://services.xmethods.net:80/soap"; var SOAP_TEMPLATE = '<?xml version="1.0" encoding="UTF-8"?>'+ '<soap:Envelope xmlns:mrns0="urn:xmethods-CurrencyExchange" '+ 'xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/" '+ 'xmlns:soapenc="http://schemas.xmlsoap.org/soap/encoding/" '+ 'xmlns:xs="http://www.w3.org/2001/XMLSchema" '+ 'xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">'+ '<soap:Body soap:encodingStyle="http://schemas.xmlsoap.org/soap/encoding/">'+ '<mrns0:getRate>'+ '<country1 xsi:type="xs:string">_FROM_</country1>'+ '<country2 xsi:type="xs:string">_TO_</country2>'+ '</mrns0:getRate>'+ '</soap:Body>'+ ...

Get Prototype and Scriptaculous: Taking the Pain out of JavaScript now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.