What is AJAX

AJAX stands for "Asynchronous JavaScript And XML".
It is a browser technology independent of web server software. It can directly communicate with the server using the Javascript XMLHttpRequest object. We can say that by the use of this object, JavaScript has become able to trade data directly with the server. With an HTTPRequest, a web page can make a request to, and get a response from a web server without reloading the page. The user will stay on same page and he/she will not notice that scripts request pages or send data to a server in the background. The best example which we she everyday is google suggest. Now, we can assume how much an AJAX application is useful! But, it is not useful everywhere. It has also some drawbacks too. So, it is not preferable to apply AJAX everywhere.
There are two ways that AJAX can access the server.
Synchronous :- In this way, script stops and waits for the server to send back a reply before continuing.
Asynchronous :- In this way, script allows the page to continue to be processed and will handle the reply if and when it arrived. Due to implementation of this way, processing become richer,user friendly, smoother as well as reduce the gap between desktop application and web application.
AJAX is based on following web standards:

• JavaScript
• XML
• HTML
• CSS

Different browsers uses different methods to use XMLHttpRequest object. For example, Firefox,Opera,Safari,Netscape use JavaScript built-in method - XMLHttpRequest while IE uses ActivexObject.

Properties of  XMLHttpRequest object

1. onreadystatechange
2. readystate
3. responseText
4. responseXML
5. status
6. statusText  

Methods of  XMLHttpRequest object

1. open()
2. send()
3. abort()
4. getAllResponseHeaders()
5. getResponseHeaders()
6. setRequestHeader()

Best way to use AJAX using jQuery is below:

google.load("jqueryui", "1.8.2");

var total;

total = jQuery.ajax({url: live_site+"/plugins/content/extravote/ajax.php",global: false, type: "POST",data: ({task : "getrating",cid:id,xid:xid,column_name:"rating_sum",dummy:new Date().getTime()}),
      dataType: "text",async:false,
      success: function(msg){ }
   }
).responseText;

alert(total);

Prototype in javaScript

Prototype is a prebuilt object  in javascript (introduced in version 1.1) which makes it possible to add one or more properties/methods in a single or all instances of an object (both types of object - prebuilt and custom).
Case 1: Below is the example to add custom property to single instance only:

//adding a custom property to a prebuilt object

var myimage=new Image()

myimage.size="26k"

/*adding a custom property to the custom object "circle"*/

//First, create the custom object "circle"

function circle(){

}

var smallcircle=new circle()

smallcircle.pi=3.14159

Case 2: We have to use prototype keyword to apply a property to all instances of an object Below is an example:

//First, create the custom object "circle"

function circle(){

}

circle.prototype.pi=3.14159

// create the object method

function alertmessage(){

alert(this.pi)

}

circle.prototype.alertpi=alertmessage

Now, all instances of circle() now has the pi property prebuilt into them. Also, all instances of the circle object contain a alertmessage() method!

case 3: Extending functionality to the pre-built string() object
We can use the prototype object on any custom objects. But, it is not for prebuilt object only. Javascript allows us to "prototype" prebuilt objects that are created with the new keyword like string object, image object, Array object, date object.

<script type="text/javascript">

/*code for extending String object with method that writes text backwards*/

//core custom method for writing text backwards

function outputbackwards(){

for (i=this.length-1;i>=0;i--)

document.write(this.charAt(i))

}

//Attach custom method to string object

String.prototype.writeback=outputbackwards

</script>

The above code just added a whole new functionality to the default string object- the ability to output any text backwards! Here are a few examples:

<script type="text/javascript">

var message1="Welcome to my site!"

message1.writeback()

var message2="Today is a beautiful day"

message2.writeback()

</script>

Output:

!etis ym ot emocleW

yad lufituaeb a si yadoT

Web Development and Design Foundations with XHTML (5th Edition)

Real example of prototype object feature of javascript. Following is the function which is used to trim spaces.
String.prototype.trim = function ()
{
return this.replace(/^\s*/, "").replace(/\s*$/, "");
}