Ajax-Programmierung - Teil 2

Ajax-Funktionen einbauen

Der benötigte JavaScript-Programmcode unterscheidet sich nur unwesentlich von dem beim Einsatz in einer reinen HTML-Seite.

Im Ereignis JS-Header (Listing 1) wird das Objekt XMLHttpRequest erstellt. Die Vorgehensweise entspricht der im vorigen Artikel erläuterten. Über drei Try-Catch-Blöcke wird getestet, welcher Browser der Anwender nutzt, und das entsprechende Objekt deklariert.

var xmlhttp = false;
try {
xmlhttp = new XMLHttpRequest();
} catch(mi) {
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (miv2) {
try {
xmlhttp = new ActiveXObject ("Microsoft.XMLHTTP");
} catch (fehler) {
alert ("XMLHttpObjekt konnte nicht erstellt werden!");
}
}
}
function seiteAktualisieren() {
if (xmlhttp.readyState == 4)
if (xmlhttp.status == 200) {
var autor = xmlhttp.responseText;
document.getElementById("autorName").innerHTML = autor;
} else
alert("Es ist ein Fehler aufgetreten. Fehlernummer: " + xmlhttp.status);
}

Die Funktion seiteAktualisieren ist Ihnen, wenn Sie den vorigen Artikel gelesen haben, ebenfalls bekannt. Die Funktion wird in Abhängigkeit von den Werten des Objektstatus sowie des zurückgegebenen Serverstatus ausgeführt. Sie liest das Ergebnis der Anfrage aus und schreibt es in den vorbereiteten Container der Webseite.

Die Instanzierung des Objekts XMLHttpRequest und die Ausführung der Anfrage erfolgt im Ereignis onChange des Kombinationsfeldes Titel. Hier unterscheidet sich der Aufruf der vom Server auszuführenden Anfrage, da wir ja kein PHPSkript, sondern einen LotusScript-Agenten verwenden wollen.

Der Einsatz von LotusScript ist im Zusammenhang mit dem Web im Regelfall mit den Maskenereignissen WebQueryOpen und Web- QuerySave verbunden. Diese werden ausgeführt, wenn eine auf einer Maske basierende Webseite geöffnet oder geschlossen wird. Dies entspricht jedoch nicht dem Grundprinzip von Ajax. Hier sollen die Daten nachgeladen werden, wenn eine Seite offen ist. Als Ausweg nutzen wir den Aufruf des Agenten über den URL-Befehl

<NameDesAgenten>?OpenAgent

Den benötigten Parameter hängen wir mit einer Zeichenkettenverknüpfung an den URL an, sodass sich insgesamt der Aufruf

"http://<Server>/<NameDB>.nsf/<NameDesAgent>?OpenAgent&<ParamName>="+<ParamWert>

ergibt. Dieser wird für den Parameter URL der Methode open() des Objekts XMLHttpRequest verwendet.

Weitere Änderungen in der Funktion seiteAktualisieren gegenüber dem bereits bekannten Beispiel fallen nicht an (Listing 2).

var buch = document.getElementById("Titel").value;
var url = "http://<Server>/ajaxdemo1.nsf/(AutorSuchen)?OpenAgent&buch="+buch;
xmlhttp.open("GET", url, true);
xmlhttp.onreadystatechange = seiteAktualisieren;
xmlhttp.send(null);