JavaScriptSource

Search 5,000+ Free JavaScript Snippets

Home / Ajax / Ajax Loader 2

Ajax Loader 2

Ajax Loader 2

General

Use this script to load XML and HTML files with XMLHTTPREQUEST. In the div id=EchoTopic tag, just add the name of the file to load and the element to display the file in, usually a div element.

Notes

  • Created by: Eddie Traversa

Source Code

Paste this source code into the designated areas.

External file

Paste this code into an external JavaScript file named: ajaxLoader.js

function ajaxLoader(url,id) {
  if (document.getElementById) {
    var x = (window.ActiveXObject) ? new ActiveXObject(“Microsoft.XMLHTTP”) : new XMLHttpRequest();
  }
  if (x) {
    x.onreadystatechange = function() {
      if (x.readyState == 4 && x.status == 200) {
        el = document.getElementById(id);
        el.innerHTML = x.responseText;
      }
    }
    x.open(“GET”, url, true);
    x.send(null);
  }
}

CSS

Paste this code into your external CSS file or in the <style> section within the HEAD section of your HTML document.

#contentLYR {
  position:absolute;
  width:200px;
  height:115px;
  z-index:1;
  left: 200px;
  top: 200px;
}

Body

Paste this code into the BODY section of your HTML document.

<body onload=”ajaxLoader(‘demo.xml’,’contentLYR’)”>


<div id=”contentLYR”>
</div>

Related Snippets: