| home / programming / ajax_starter_kit2 |
|
|
Listing 11.3 shows the complete client-side code for our Ajax application.
Loading the page into our browser, we can see that the server time is displayed in the <div> container, indicating that the onLoad event handler for the <body> of the page has fired when the page has loaded.
Note also that we have provided user feedback via the line
which executes on each change to the value readyState until the condition
is satisfied. This line loads into the time display element an animated GIF with a rotating pattern, indicating that a server request is in progress, as shown in Figure 11.2. This technique was described in more detail in Lesson 10.
TIP: If you have a fast server and a good Internet connection, it may be difficult to see this user feedback in action because the time display is updated virtually instantaneously. To demonstrate the operation of the animated GIF image, we can slow down the server script to simulate the performance of a more complex script and/or an inferior connection, by using PHP's sleep() command:
The line
forces the server to pause program execution for x seconds.
Now, each time we click on the Get Server Time button, the time display is updated. Figure 11.3 shows the completed application.
In this lesson, we constructed a simple yet complete Ajax application that does the following:
|

| home / programming / ajax_starter_kit2 |
URL: