Click here to Skip to main content
15,896,154 members
Articles / Web Development / XHTML

Simple and Practical Introduction to Asynchronous JavaScript and XML (AJAX)

Rate me:
Please Sign up or sign in to vote.
4.81/5 (30 votes)
20 Jul 2009CPOL16 min read 59.5K   536   77  
A simple and practical introduction to Asynchronous JavaScript and XML (AJAX).
<html>
<head>
    <title>First AJAX Example</title>
</head>
<script type="text/javascript">

    var request;
    var READYSTATE_COMPLETE = 4;

    // Provide the XMLHttpRequest class for IE 5.x-6.x: 
    // Other browsers (including IE 7.x-8.x) ignore this 
    // when XMLHttpRequest is predefined 
    if (typeof (XMLHttpRequest) == "undefined") {
        XMLHttpRequest = function() {
            try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); }
            catch (e) { }
            try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); }
            catch (e) { }
            try { return new ActiveXObject("Msxml2.XMLHTTP"); }
            catch (e) { }
            try { return new ActiveXObject("Microsoft.XMLHTTP"); }
            catch (e) { }
            throw new Error("This browser does not support XMLHttpRequest.");
        };
    } 
    
    function ReadXmlFile() {
    
        // Create XMLHttpRequest object
        request = new XMLHttpRequest();

        // Open an XML file
        request.open('GET', 'note.xml', true);

        // Attach completion handler to the request
        request.onreadystatechange = DisplayXmlFile;

        // Send async request to the server with null context
        request.send(null);
    }

    function DisplayXmlFile() {
        if (request.readyState == READYSTATE_COMPLETE) {
            xmlSpan.innerText = request.responseText;
        }
    }
    
</script>
<body>
    <span id="xmlSpan"></span><input type="button" onclick="ReadXmlFile();" value="ReadXml" />
</body>
</html>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer (Senior) MixModes Inc. | Research In Motion
Canada Canada
Ashish worked for Microsoft for a number of years in Microsoft Visual Studio (Architect edition) and Windows Live division as a developer. Before that he was a developer consultant mainly involved in distributed service development / architecture. His main interests are distributed software architecture, patterns and practices and mobile device development.

Currently Ashish serves as a Technical Lead at RIM leading next generation BlackBerry media experience and also runs his own company MixModes Inc. specializing in .NET / WPF / Silverlight technologies. You can visit MixModes at http://mixmodes.com or follow it on Twitter @MixModes

In his free time he is an avid painter, hockey player and enjoys travelling. His blog is at: http://ashishkaila.serveblog.net

Comments and Discussions