7. February 2012
von Blackbam
Nothing new, nothing special... just the working code of a basic Ajax skeleton, as this has to be copied and pasted that often. This example shows an application similar to Google suggest, which searches related values, whenever a key is pressed.

Note: Since jQuery is that popular today, it is possibly better to use this (see jQuery Ajax Tutorial).
index.html - function call and result representation

Ajax test

ajax.js - request, response and data processing
var XMLHTTP = null;

function AjaxRequest(compString) {

// XMLHTTP-Request Objekt erzeugen, dabei auf Browserkonformität achten
	if(window.XMLHttpRequest) {
		XMLHTTP = new XMLHttpRequest();
	} else if(window.ActiveXObject) {
		try {
			XMLHTTP = new ActiveXObject("Msxml2.XMLHTTP");
		} catch(ex) {
			try {
				XMLHTTP = new ActiveXObject("Microsoft.XMLHTTP");
			} catch(ex) {
	XMLHTTP.onreadystatechange = MyRequestExecute;

// wird jedes mal aufgerufen, wenn der XMLHTTP-Request eine neue Stufe erreicht, bei 4 ist die Antwort des Servers eingetroffen
function MyRequestExecute() {
	// responseText als Javascript-String, responseXML als Javascript XML-DOM-Element, status Statuscode, statusText des. Beschreibung
	if(XMLHTTP.readyState == 4) {
		document.getElementById("result").innerHTML = XMLHTTP.responseText;

The server side

} catch (Exception $e) {
    echo 'Verbindungsaufbau fehlgeschlagen: ',  $e->getMessage(), "\n";

echo $_GET['compString']."< pre >".$horst."";


Dieser Eintrag wurde am 7. February 2012 um 10:10 in der Kategorie JavaScript / Ajax veröffentlicht. You can book the comments for this article RSS 2.0. Feedback, discussion, commendation and critics are welcome: Write a comment or trackback.

Tags: , , ,

Warning: Use of undefined constant Ext_related_links - assumed 'Ext_related_links' (this will throw an Error in a future version of PHP) in /home/.sites/609/site1266/web/blackbams-blog/wp-content/themes/SilentWoodsByBlackbam/single.php on line 75

No comments yet

Kommentare abonnieren (RSS) or URL Trackback

Leave a comment: