Teil 2: Tipps & Tricks für Ajax
Im nächsten Schritt wird mithilfe der Funktion GetXmlHttpObject() der Browser Support für Ajax überprüft....
Im nächsten Schritt wird mithilfe der Funktion GetXmlHttpObject() der Browser Support für Ajax überprüft.
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject
("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject
("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
Dabei werden die unterschiedlichen Browser durchgetestet und auf Basis der Funktion XMLHttpRequest beziehungsweise beim Internet Explorer mithilfe des entsprechenden Active-X-Objects die Kompatibilität ermittelt.
Erhalten Sie einen Initialwert zurück, unterstützt der aufrufende Browser kein Ajax. Ansonsten wird im nächsten Schritt der Suchstring für die PHP-Funktion suche Hinweis auf Basis des Eingabewerts sowie eine zufällig generierte ID zusammengebaut.
xmlHttp.onreadystatechange speichert den aktuellen Wert, der vom Server gekommen ist, zwischen. Dazu bedient sich die Eigenschaft der Funktion stateChanged.
function stateChanged() {
if (xmlHttp.readyState==4)
{
document.getElementById
("txtVorschlag").innerHTML=xmlHttp.responseText;
}
}
An dieser Stelle wird gewartet, bis die Anfrage komplett ist und anschließend der ermittelte Wert dem Feld txtVorschlag zugewiesen.
Die eigentliche Abfrage auf Basis des PHP-Skripts sucheHinweis.php erfolgt in den nächsten beiden Zeilen xmlHttp.open("GET",url,true); und xmlHttp.send(null); Die Anfrage wird somit direkt gesendet und nicht auf eine Antwort gewartet. Diese wird - wie bereits erwähnt - über xmlHttp.readyState==4 zurückgemeldet und dem Text zugewiesen.
Innerhalb des Skripts wird letzten Endes nur das Array a$ mit der übermittelten Zeichenkette verglichen. Gibt es Übereinstimmungen bei den Anfängen des Suchstrings und Einträgen des Arrays, so werden diese gesammelt und anschließend der Variablen antwort übergeben.