Ajax for dummies

Html, java, XMLHttpRequest et un simple script bash …

~~READMORE~~

Bash scripte test1 :

#!/bin/bash
#set -x

cat - <<EOD
Content-Type: text/html; charset=utf-8
Cache-Control: max-age=0

Titi Jaja
EOD

# ----------
# EOF

Html source (with java):

<!DOCTYPE html>
<html lang="fr">
  <head>
    <title>Ajax Test</title>
    <meta charset="UTF-8" />
    <script>
      function getXMLHTTPRequest()
      {
        try { return new XMLHttpRequest(); }
        catch(e) {
          // IE5 and IE6 ...
          try { return new ActiveXObject('Microsoft.XMLHTTP'); }
          catch(e) {
            try { return new ActiveXObject('Msxml2.XMLHTTP'); }
            catch(e) {
              return false;
            }
          }
        }
      };

      function testjs()
      {
        var req = getXMLHTTPRequest();
        var sync = false;
        var params = 'arg1=Hello&arg2=World';

        if ( sync ) {
          // *Not recommended*, but possible.
          // see: http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp
          req.open('POST', '/cgi-bin/test1',false);
          req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
          req.send(params);
          document.getElementById("nom").innerHTML = req.responseText;
        }
        else {
          // Asynchrone
        
          req.onreadystatechange = function() {
            if ( ( req.readyState == 4 ) && ( req.status == 200 ) ) {
              document.getElementById("nom").innerHTML = req.responseText;
            }
          };

          req.open('POST', '/cgi-bin/test1');
          req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
          req.send(params);
        }
        
      };
    </script>
  </head>
  <body>
    Hello World!<br/>
    Bonjour <span id="nom"><button onclick="testjs()">qui ?</button></span>
  </body>
</html>

Voila.

More? http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp