Example project-stockprice reader - AJAX

Let’s use the prototype.js library to build a simple reader that updates periodically to show the latest value returned from the server. In this example,we’ll use a simple server-side script rand.php to simulate a changing stock price:

This script first initializes PHP’s random number routine by calling the srand() function and passing it an argument derived from the current time.The rand(0,5000) function is then used to generate a random number that is manipulated arithmetically to produce phony “stock prices” in the range 50.00 to 100.00.

Now let’s build a simple HTML page to display the current stock price.This page forms the basis for our Ajax application:

Note that we included the prototype.js library by means of a <script> tag in the document head.We also defined a <div> with id set to “price”, which will be used to display the current stock price.

We now need to implement the Ajax.PeriodicalUpdater class, which we’ll attach to the document body element’s onLoad event handler. Listing shows the complete script.

Ajax Stock Price Reader Using prototype.js

Look how simple the code for the application has become through using prototype.js. Implementing the application is merely a matter of defining a one-line function checkprice() to instantiate our repeating Ajax call and calling that function from the body element’s onLoad event handler.

From the arguments passed to Ajax.PeriodicalUpdater, you’ll see that a 3-second repeat interval has been specified.This period does no change with subsequent calls because the decay value has been set to 1.

Figure shows the application running.What cannot be seen from the figure, of course, is the stock price updating itself every 3 seconds to show a new value.

Ajax stock reader

Ajax stock reader

This simple example does not come close to showing off the power and versatility of the prototype.js library. Rather, it is intended to get you started with your own experiments by offering an easy point of access to this great resource.

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

AJAX Topics