Simple ajax request using mootools1.2 and Smooth scroll in mootools

Published on
10,056 Points
Last Modified:
There is basically two types of AJAX request in mootools.

Request  and Request.HTML


Request is the basic XHR request class in MooTools. While not extremely useful on its own, it provides the basic functionality for both Request.HTML and Request.JSON.

Demo Code:

var req = new Request({
url: demo_path + ‘data.txt’,
onSuccess: function(txt){
$(‘result’).set(‘text’, txt);
// Our request will most likely succeed, but just in case, we’ll add an
// onFailure method which will let the user know what happened.
onFailure: function(){
$(‘result’).set(‘text’, ‘The request failed.’);


Open in new window


Request.HTML is a subclass of Request built for making XHR requests which return HTML content.

Demo Code:

var req = new Request.HTML({url:demo_path+’data.html’,
onSuccess: function(html) {
//Clear the text currently inside the results div.
$(‘result’).set(‘text’, ”);
//Inject the new DOM elements into the results div.
//Our request will most likely succeed, but just in case, we’ll add an
//onFailure method which will let the user know what happened.
onFailure: function() {
$(‘result’).set(‘text’, ‘The request failed.’);


Open in new window

Another parameter for Request.HTML is as below:

Open in new window

Here id of the element should be passed, and what ever the response will be placed inside the given element ID.
----------------------------------------------------------- --------------------------------- --------------------------

Smooth Scroll in mootools 1.2

How to scroll to the top of the page or any portion of the page very smoothly?

here is the solution for that. Please check.

When we use anchor link to go to specific portion of the then browser jurks to that portion of the page.

Below mootools plugin is useful to scroll the page very smoothly.

Mootools have in built plugin to get page scrolled smoothly as you want.

Below are the steps to include that:

Include mootools1.2 in your file, if you don’t have download it from mootools site
To enable the scroll plugin add the below code in your head section after including mootools JS

//when the dom is ready
window.addEvent(‘domready’,function() {
//smooooooth scrolling enabled
//new SmoothScroll({ options }, window);
new SmoothScroll({ duration:700 }, window); //700 define the duration in mili second to go to the portion of the //page

Open in new window

Now use the traditional anchor tag in your web page  and you will get page scrolled very smoothly.

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Join & Write a Comment

From store locators to asset tracking and route optimization, learn how leading companies are using Google Maps APIs throughout the customer journey to increase checkout conversions, boost user engagement, and optimize order fulfillment. Powered …
Basic Overview of office 365 user portal
Next Article:

Keep in touch with Experts Exchange

Tech news and trends delivered to your inbox every month