Mootools Ajax Example

February 6 2009, 5:15am Posted to google.com

Here’s a quick example of an ajax request with Mootools. the code below is from sandmoose.com. However I have modified it to get the data using the twitter search api. So the script contains 4 functions, the first function ‘initializeContainer’ makes a new ajax request to our file, in this case ‘twitter.php’. The next function initialises the fade out effect, and tells the function that onComplete to trigger the function ‘updateContainer’. This function puts the data from our file ‘twitter.php’ into the div with and id of contain, once this is done it triggers the function ‘fadeinContainer’ which fades the contents of the div back in. You need to include the mootools framework, here’s the Google hosted link:

The Code:

function initializeContainer() { new Ajax('twitter.php', {update:'contain'}).request(); }

function ajaxRequest() { $('contain').effect('opacity',{duration:1000, fps:50, onComplete:updateContainer}).start(1,0); };

function updateContainer() { new Ajax('twitter.php', {update:'contain', onComplete:fadeInContainer}).request(); }

function fadeInContainer() { $('contain').effect('opacity',{duration:1000, fps:50}).start(0,1); }

We need to initialise the function onload.

Via: http://feedproxy.google.com/~r/AshleyFord-Papermashupcom/~3/dXC7UFk2DUM/

Download this sweetcron theme for FREE

Mootools Ajax Example

Popular Tags