PeriodicalUpdater for jQuery
John McCollum March 9th, 2009
Here at 360innovate we’ve benefitted greatly from free and open source software.
Whether it’s the web server our sites run on or the operating system that runs the web server, free and open source software plays a huge part in the industry we work in.
And so, we present this jQuery plugin in an effort to give a little something back!
The Prototype javascript library features a very useful PeriodicalUpdater() function. This loads content at specified intervals, but if the content being pulled in doesn’t change, the interval gradually increases.
There are several benefits to this approach – it saves bandwidth, and can reduce the CPU usage on the client’s machine.
Unfortunately, there’s been no way to replicate this using jQuery…until now!
Let’s take a look at how it works.
Step 1 – Include the latest version of jQuery and the plugin.
<script src="jquery-1.3.2.min.js" type="text/javascript"></script> <script src="jquery.periodicalupdater.js" type="text/javascript"></script>
Step 2 – call the function with the necessary options and a callback function
$(document).ready(function(){
$.PeriodicalUpdater({
url : 'random.php'
},
function(data){
var myHtml = 'The data returned from the server was: ' + data + '';
$('#results').append(myHtml);
});
})
Here’s a list of all the options you can set:
url
URL for the ajax request. (Required!)
method
Can be either get or post. (Or GET or POST!)
sendData
Array of values to be passed to the page – e.g. {name: “John”, greeting: “hello”}
minTimeout
Starting value for the timeout in milliseconds.
maxTimeout
Maximum length of time between requests.
multiplier
Sets the amount of decay between ajax requests. If this is set to 2, the length of time between each request will double while the response doesn’t change.
type
Response type – can be text, xml, json etc – as with jquery.get or jquery.post.
Step 3 – Stop the requests!
Finally, you might want to stop ajax requests from PeriodicalUpdater – you can do so like this (assuming you had a link with id stop):
$('a#stop').click(function(e){
e.preventDefault();
clearTimeout(PeriodicalTimer);
})
We hope you find this plugin useful. It’s dual licensed under the GPL and MIT licences (just like jQuery), so please read them before you use this plugin.
