Logo  

CS479/579 - Web Programming II

Displaying ./code/AJAX/ajax.html

<!DOCTYPE html>
<html>
<head>
 <title> AJAX example </title>
 <meta charset='utf-8'>
 <style>
 code { font-size: 150%; }
 pre { border: 1px solid gray; }
 </style>
 <script>
function loadurl(url, callback)
{
  var req = new XMLHttpRequest();
  req.open('GET', url, true);
  req.overrideMimeType('text/plain; charset=x-user-defined');
  req.onreadystatechange=function() {
    if (req.readyState==4 && req.status==200) callback(req.responseText);
  };
  req.send(null);
}

function loaddata()
{
  loadurl("data.php", function(data) {
    document.getElementById("data").innerHTML = JSON.parse(data);
  });
}
 </script>
</head>
<body>
<button onclick='loaddata();'> Click me </button>
<pre>
<code id='data'></code>
</pre>
</body>
</html>