AHAH: Asychronous HTML and HTTP

AHAH is a very simple technique for dynamically updating web pages using JavaScript (http://en.wikipedia.org/wiki/JavaScript). It involves using XMLHTTPRequest (http://en.wikipedia.org/wiki/XMLHTTP) to retrieve (X)HTML (http://en.wikipedia.org/wiki/HTML) fragments which are then inserted directly into the web page, whence they can be styled using CSS (http://en.wikipedia.org/wiki/Cascading_Style_Sheets).

Relation to AJAX

AHAH is intended to be a much simpler way to do web development (http://en.wikipedia.org/wiki/Web_development) than AJAX (http://en.wikipedia.org/wiki/Ajax_%28programming%29): "Asynchronous JavaScript and XML." Strictly speaking, AHAH can be considered a subset of AJAX, since (X)HTML is just a special kind of XML. However, it is a subset with some very specific and useful properties:

1. The lack of custom XML schemas dramatically reduces design time
2. AHAH can trivially reuse existing HTML pages, avoiding the need for a custom web service
3. All data transport is done via browser-friend HTML, easing debugging and testing
4. The HTML is designed to be directly embedded in the page's DOM, eliminating the need for parsing
5. As HTML, designers can format it using CSS, rather than programmers having to do XSLT transforms
6. Processing is all done on the server, so the client-side programming is essentiall nil (moving opaque bits)

In fact, for any content that is destined to be viewed by the browser, it is virtually impossible to imagine any advantage to sending it as custom XML rather than structurally-correct HTML (with appropriate CSS-friendly class names, of course).

That said, many applications of AJAX are (at least in theory) targeteable at custom JavaScript code or desktop GUIs rather than mere browsers. For those cases, the advantages of HTML over custom XML are somewhat less. However, even here, it may well make sense to encode data using xoxo -- aka XHTML Property Lists -- which can be losslessly converted back and forth from standard data structures (lists and dictionaries) without the need for custom parsers.

Source Code

Unlike the various libraries (e.g., JSON (http://en.wikipedia.org/wiki/JSON), MochiKit (http://mochikit.com/)) important for AJAX, all of AHAH is contained in a single JavaScript file (also available as ahah.js (http://www.opendarwin.org/~drernie/src/ahah.js) and jah.js (http://homepage.mac.com/kevinmarks/jah.js)). In fact, this is little more than the canonical XMLHttpRequest example, and is simple enough for any modern web designer to embed within their existing web pages.

Send AHAH Request

function ahah(url,target) {
   // native XMLHttpRequest object
   document.getElementById(target).innerHTML = 'sending...';
   if (window.XMLHttpRequest) {
       req = new XMLHttpRequest();
       req.onreadystatechange = function() {ahahDone(target);};
       req.open("GET", url, true);
       req.send(null);
   // IE/Windows ActiveX version
   } else if (window.ActiveXObject) {
       req = new ActiveXObject("Microsoft.XMLHTTP");
       if (req) {
           req.onreadystatechange = function() {ahahDone(target);};
           req.open("GET", url, true);
           req.send();
       }
   }
}