On the Web | The uniAjax framework is available for free at http://aka-fotos.de/web/?ajax/uniajax. Download uniAjax.js, and you’re in business. |
Putting uniAjax to work is simple. For example, say you want to download the text in the file uniAjax.txt, which has these contents:
This text was downloaded with uniAjax.
This example will be called “testUniAjax.html.” As described in earlier examples, you create a button, this time connected to a function named useUniAjax. You also need a <div> element to display the downloaded data:
<form> <input type = "button" value = "Display the text" onclick = "useUniAjax()"> </form> <div > <p>The fetched data will go here.</p> </div>
Start this example by including uniAjax.js, like this:
<head> <title>Testing the uniAjax framework</title> <script language="JavaScript" src="/books/1/252/1/html/2/uniAjax.js"></script> . . .
The button is tied to the useUniAjax function. In this function, create a new uniAjax object:
<head> <title>Testing the uniAjax framework</title> <script language="JavaScript" src="/books/1/252/1/html/2/uniAjax.js"></script> <script language = "javascript"> function useUniAjax() { ajax = new uniAjax(); . . . } </script> </head>
Then call the uniAjax object’s request method, passing it the URL to access and the call back function. The uniAjax request method uses JavaScript-named parameters, which you pass like this: 'url': 'uniAjax.txt'.
Here’s what the call to the request method looks like:
<head> <title>Testing the uniAjax framework</title> <script language="JavaScript" src="/books/1/252/1/html/2/uniAjax.js"></script> <script language = "javascript"> function useUniAjax() { ajax = new uniAjax(); ajax.request({'url': 'uniAjax.txt', 'func': callback}); } </script> </head>
You also need a callback function to handle the response text from the server and display that text. Here’s what that looks like:
<head> <title>Testing the uniAjax framework</title> <script language="JavaScript" src="/books/1/252/1/html/2/uniAjax.js"></script> <script language = "javascript"> function useUniAjax() { ajax = new uniAjax(); ajax.request({'url': 'uniAjax.txt', 'func': callback}); } function callback(response, id) { document.getElementById("targetDiv").innerHTML = response; } </script> </head>
You can see this page, testUniAjax.html, at work in Figure 6.5.
Figure 6.5: Downloading text with the uniAjax Ajax framework