File "ajax4.html"

Full Path: /home/analogde/www/TEST/chapter03/ajax4.html
File size: 1.48 KB
MIME-type: text/html
Charset: utf-8

 
Open Edit   Advanced Editor   Back 
<html> 
  <head> 
    <title>Sending Data to the Server With POST</title> 

    <script language = "javascript">
      var XMLHttpRequestObject = false; 

      if (window.XMLHttpRequest) {
        XMLHttpRequestObject = new XMLHttpRequest();
      } else if (window.ActiveXObject) {
        XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
      }

      function getData(dataSource, divID, data) 
      { 
        if(XMLHttpRequestObject) {
          var obj = document.getElementById(divID); 
          XMLHttpRequestObject.open("POST", dataSource); 
          XMLHttpRequestObject.setRequestHeader('Content-Type', 
            'application/x-www-form-urlencoded'); 

          XMLHttpRequestObject.onreadystatechange = function() 
          { 
            if (XMLHttpRequestObject.readyState == 4 && 
              XMLHttpRequestObject.status == 200) { 
                obj.innerHTML = XMLHttpRequestObject.responseText; 
            } 
          } 

          XMLHttpRequestObject.send("data=" + data); 
        }
      }
    </script>
  </head> 

  <body>

    <H1>Sending Data to the Server With POST</H1>

    <form>
      <input type = "button" value = "Fetch message 1" 
        onclick = "getData('dataresponderpost.php', 'targetDiv', 1)"> 
      <input type = "button" value = "Fetch message 2" 
        onclick = "getData('dataresponderpost.php', 'targetDiv', 2)"> 
    </form>

    <div id="targetDiv">
      <p>The fetched message will appear here.</p> 
    </div> 

  </body> 
</html>