HI,
von den unteren Dateien die Endungen ändern. books.txt in books.xml, die andere in .html
Ich beschäftige mich damit z.Zt. primär von der Java Schiene aus, werde aber keine DWR und sonstigen Java only Sachen posten, sondern nur die auf die Domino gehen.
Auch kein Ruby on Rails, VB.NET oder pHp. (Viele Beispiele sind für diese Plattformen).
Bin selber noch Anfänger und hier erst einmal ein sehr einfaches Ajax Beispiel.
Man kann das einfach z.b. in einen selbsterstellten Ordner Ajax im Ordner Domino-Data/domino/html tun (Beide Dateien).
Das gute an einfach ist vielleicht, dass man da als Einsteiger einen gewissen Überblick behält, worum es bei Ajax eigentlich ungefähr geht.
dann Notes-Server hochfahren und http://127.0.0.1/ajax/MyHtml.html in Mozilla oder IE.
Auf den "Get a Document"-Knopf drücken.
Es werden vom Server Daten gelesen, ohne das die Seite im Browser neu geladen wird:
zum Quellcode:
var xmlhttp= null; // (1)
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); // (1)
function GetIt(url) {
alert ("in GetIt");
if (xmlhttp) {
} else if (window.XMLHttpRequest){
// for other browsers
xmlhttp = new XMLHttpRequest(); // (1)
} else {
alert("browser not supported");
return;
}
xmlhttp.open('GET', url, false); //(2)
xmlhttp.send(null);
alert("Ergebins=" + xmlhttp.responseText);
document.getElementById('result').innerHTML = xmlhttp.responseText; // (3)
}
1. xmlhttp ist ein extra Ajax-unterstützendes Objekt, dass es in IE, Mozilla und anderswo gibt.
2. mit diesem Objekt kann aus dem JavaScript der Webseite selber ein Request gegen den Server, der die Seite geliefert hat, abgesendet werden (und die Antwort empfangen werden).
Der 3. Parameter von xmlhttp.open ist false. Das bedeutet, dass dieser Request synchron ausgeführt wird. (nicht asynchron). Das Beispiel ist also gar kein AJAX (das erste A steht für asynchronous) sondern vielleicht SJAX ;D
3. über document.getElementById etc. wird per Web-DOM die Antwort des Servers in die Webseite eingefügt.
Verbesserungen folgen.
Gruß Axel
Neue Version.
MyHtml.html kann mit der neuen Version (Attachment) ausgetauscht werden.
Dafür muß der Notes Server nicht runtergefahren werden. Dafür aber aufpassen auf Browser-Cache:
Shift + Aktualisieren Button.
Vorsicht: Der untere Teil des Javascripts ist völlig auskommentiert.
Es ist nun wirklich Ajax.
Parameter dieser Methode ist true, also findet der Aufruf gegen den Server asynchron statt.
xmlhttp.open('GET', url, true);
Vor dem Send wird nun ein Callback-Handler für den Ajax-Objekt (also xmlhttp) ->EventHandler onreadyStateChange definiert (updatePage).
xmlhttp.onreadystatechange = updatePage;
xmlhttp.send(null);
updatechange ist eine von mir definierte Funktion:
function updatePage() {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
alert("serverResponse=" + xmlhttp.responseText);
document.getElementById('result').innerHTML = xmlhttp.responseText;
}
}
}
Das ist Event-orientierte Programmierung. Gibts ja in Notes viel.
Der Browser ruft nun diese Methode bei State-Änderungen des Ajax-Objekts (xmlhttp) auf. Es sind 5 states definiert.
* 0: The request is uninitialized (before you've called open()).
* 1: The request is set up, but hasn't been sent (before you've called send()).
* 2: The request was sent and is being processed (you can usually get content headers from the response at this point).
* 3: The request is being processed; often some partial data is available from the response, but the server hasn't finished with its response.
* 4: The response is complete; you can get the server's response and use it.
Nur der Status 4 (alles fertig) interessiert uns. Deshalb das erste if in der Funktion
updatePage() {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
Dann wird die Antwort wieder in die Web-Dom Repräsentation der im Browser dargestellten Webseite reingeschrieben... und vorher in eine alert-box ausgegeben (hatten wir in Beispiel 1 schon):
alert("serverResponse=" + xmlhttp.responseText);
document.getElementById('result').innerHTML = xmlhttp.responseText;
EINFACH AUSPROBIEREN. DANN KÖNNTE ES KLAR WERDEN, WORUM ES HIER GEHT.
WIRKLICH GUTER ARTIKEL:
http://www-128.ibm.com/developerworks/web/library/wa-ajaxintro2/?ca=dgr-lnxw07AJAX-Request
Hier wird eine Menge erklärt (auch von dem hier von mir publizierten Code).
Der Autor hat auch ein Buch in Kathy Sierras / Bert Bates "head first" Serie zu Ajax publiziert. Dies hab ich mir direkt über Caiman America (mein neuer Lieblings Amazon Discounter) für 22.90 Euro gekauft.
ÜBRIGENS:
Es sollte sich ja inzwischen rumgesprochen haben, dass JavaScript und Java 2 völlig unterschiedliche Sachen sind. Bei Ajax nutzt man schon bei den einfachen Beispielen oben Konstrukte, die xTreme un-java sind.
Z.B. einen event-Handler einfach mit der Zeile:
xmlhttp.onreadystatechange = updatePage;
Gruß Axel