AJAX : Asynchronous JavaScript and XML
Teil 2 : AJAX und avanti
Teil 1 : Grundlagen
Hier kommen wir nun zur konkreten Anwendung in Verbindung mit avanti! Auch hier geht es nur darum, das Bauprinzip einer funktionierenden Anwendung so klar wie möglich herauszustellen.
Schauen Sie sich wieder im Quelltext dieses Dokuments das JavaScript im Header an! (Weiter unten ist das Skript aufgelistet, damit Sie es beim Drucken dieser Seite dabeihaben!)
Sie finden auch hier die zwei Funktionen, der Aufgabe entsprechend verändert:

requesT()  : Sendet einen Request ab, startet axa.php
receivE()  : Verarbeitet das zurückkommende Ergebnis
Die Methode  requesT() soll jetzt andere Aufträge an ein anderes PHP-Programm übermitteln:

[Aktion A]
>>> Hier wird das Ergebnis des PHP-Programms ajx.php erscheinen  <<<
Wie das geht? Dies ist ein <div> mit id="erg", und JavaScript verändert den Inhalt.
Denn JavaScript kann auf jedes Element zugreifen, das ein id-Attribut hat.
[Aktion B]

Der Link dahinter lautet javascript:requesT('600') bzw. javascript:requesT('620').
Wird auf eine [Aktion] geklickt, dann geht dieser Request raus an den Webserver:
axa.php?urN=600 bzw. axa.php?urN=620

Auf dem Server wird dann das Programm axa.php gestartet und ihm in der Variablen  urN  der Wert  600 bzw. 620 übergeben. Darin eingebettet ist ein avanti-Job.
Das Programm axa.php sieht so aus: (die Variable bekommt in PHP den Namen $urN)
<?php
include_once("av_inix.php");  // allgemeine Sachen

$urN = $_REQUEST['urN'];  // Variable uebernehmen

$k=av_axa($urN,$erg);

if($k==-1) echo "Sorry, keine Verbindung. Vielleicht Server nicht in Betrieb.";
else
  av_out($erg);  // array $erg wird mit echo-Befehlen ausgegeben


function av_axa($recnum,&$output)
{
 global $Server,$Port;  // in av_ini.php

 //   Kernstück: Der avanti-Job:
 $job = array(
"wri '<i>Titel:</i> ' #20 '<br><i>Signatur:</i> ' #90",
"var '#' '$recnum'",
"find",
"wri #20 '<br>' #90 ",
":exit"
 );              // Ende des Jobs
// Job senden
 $k = sendjob($Server, $Port, $job, $output);
 return $k;   // $k = Anzahl Zeilen in $output, -1 bei Fehler
}
?> 

Will man nun AJAX mit avanti anwenden, besteht die Hauptaufgabe im Schreiben der avanti-Jobs und der jeweiligen Funktion  receivE(), die das Ergebnis des Jobs verwertet. Alles andere ist mit dem hier vorgestellten Schema leicht zu erledigen. Was in PHP mit dem echo-Befehl bzw. im avanti-Job mit dem write-Befehl ausgegeben wird, genau das kommt dann in der Funktion receivE() an, und zwar als http.responseText.
  So sieht das JavaScript aus, das in dieses Dokument eingebaut ist:
Auch hier wieder: nur das Rote muß man verstehen, alles andere kann so bleiben!
Oder in der ultimativen Prägnanz des Fußball-Idioms: Das Eigene muß in das Rote.

<script language="javascript">
// ****** Allgemeiner Teil (immer gleich) *****
function cReqObj() // ein "request object" anlegen
 {
  brws = navigator.appName;
  if(brws == "Microsoft Internet Explorer")
  rq = new ActiveXObject("Microsoft.XMLHTTP");
  else rq = new XMLHttpRequest(); return rq;
 }

// Globales Request-Objekt anlegen:
 rqo = cReqObj();

// wird aus dem Dokument aufgerufen z.B. mit javascript:requesT('620') :
function requesT(wert)
{
 // Programm axa.php aufrufen:
 rqo.open('get', 'axa.php?urN=' +wert);
 //               anwendungsspezifisch!
 rqo.onreadystatechange = receivE; // Die Ausgabedaten gehen an die Funktion receivE()
 rqo.send(null);
}

// **************** Spezifischer Teil *********
// Wird ausgefuehrt, sobald Ergebnis zurueckkommt
 function receivE()
{
 if(rqo.readyState == 4)
 {
  // Die Ausgabe des PHP-Programms auswerten:
  ergeb = rqo.responseText;
  document.getElementById("erg").innerHTML = ergeb;

 }
}
</script>
   
B.Eversberg, 2006-07-14