Networking, Programming and Graphics Tutorials

AJAX Tutorial [1/3]

Type: Code Networking, Programming and Graphics Tutorials
AJAX Tutorial
Level: Beginner Networking, Programming and Graphics Tutorials 
AJAX Tutorial
Date: 2008-Jul-01
AJAX Tutorial
Visited: 4207 times
AJAX Tutorial
Rating: AJAX Tutorial
AJAX Tutorial
Author: Ivory Morhuld

To see how AJAX works, we will develop small AJAX Web Application.

First of all we need some HTML file with forms to input data. This will be one input field where we can write some text. In our case this will be some name. This HTML file we will save under ajax.html name. The code of HTML file can taken from box bellow: (Please note that the text input handle onkeypress event and call to ajax(); function and there is no "Submit" button in HTML form)

<html>
<body>
<input type="text" onkeyup="ajax(this.value);">
</br>
<div id="result"></div>
</body>
</html>
The key of each AJAX application is the XMLHttpRequest object. In some browsers we have to use one methods to create the XMLHttpRequest object. In other browser we have to use other method. Because we don't know what browser use the user we will try each method until we successfully make XMLHttpRequest object.

var xmlhttp;
try {
    xmlhttp=new XMLHttpRequest();
}
catch (e) {
    try {
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
         catch (e) {
        try {
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch (e) {
            alert("Your browser does not support AJAX!");
            return false;
        }
    }
}
Networking, Programming and Graphics Tutorials - AJAX Tutorial [1/3] - Networking, Programming and Graphics Tutorials

Need a specific tutorial? Do not hesitate and submit a request!
Related Tags: ajax ::ppt + tutorial  ajax tutorial ppt  ajax tutorial ppt  php ajax tutorial  ppt of AJAX tutorial  ajax ppt tutorial  ajax ppt tutorial  Ajax .Net Tutorial  ajax tutorial php  AJAX Tutorial