Aus AJAX wird SJAJ

SJAJ? Richtig gelesen: “Synchronous JavaScript and JSON”. Zugegebenermaßen: nicht besonders einfallsreich, aber ich dachte mir: “Hey, machste mal eine Wortneuschöpfung”.

Synchrone JavaScript-Calls sind an sich ziemlich unsinnig, da das gegen die AJAX-Idee spricht.
Allerdings gibt es unter Umständen dafür einen Verwendungszweck.
Ich brauchte diese Funktionalität für die Erweiterung von “AZE Online”:
Darin existieren zwei Select-Boxen. Die eine enthält die Kunden, die andere die zugehörigen Projekte eines Kunden.

Wenn ich nun einen bestehenden Arbeitszeiteintrag editieren will, werden die passenden Einträge der Select-Box selektiert. Was passiert nun aber, wenn ich die Id des Projekts setzen will, aber der Inhalt der SelectBox an sich noch gar nicht geladen ist?
Vor diesem Problem stand ich nun. Die logischste (und umständlichste) Methode wäre nun, eine Funktion zu schreiben, die die Daten vom RTOGateway (ich benutze mein DAOFramework) lädt und im Anschluss die Id selektiert, die als Parameter übergeben wurde. Damit kommt man aber zu einer gewissen Methoden-Redundanz – die Methode, die dies tut wird an andere Stelle ebenfalls aufgerufen.

Ich habe deshalb unsere JS-AJAX-Klasse -die mit JSON zusammenarbeitet- um eine blockingHttpRequest-Methode erweitert:

/**
 * httpRequest()
 *
 * Setzt einen XMLHttpRequest ab.
 *
 * @param string uri URI des aufzurufenden AJAX-Servers
 * @param object objData JS-Objekt mit den Daten, die an den AJAX-Server gesendet werden sollen
 * @param function ResponseHandler Name der Funktion die die Antworten vom AJAX-Server empfangen soll
 * @param boolean Ist der Request synchron bzw. blockiert? (Optional, kann weggelassen werden. Default ist FALSE)
 * @return
 */
function httpRequest(uri,objData,ResponseHandler, isBlocking) {
	var ajax = new AjaxClass;

	if (isBlocking)
	{
	  ajax.blockingHttpRequest(uri, objData, ResponseHandler);
	}
	else
	{
	  ajax.httpRequest(uri,objData,ResponseHandler);
	}
}

/**
 * blockingHttpRequest()
 *
 * Setzt einen blockierenden HTTP-Request ab. Kann benutzt werden, damit auf bestimmte Ereignisse gewartet wird, widerspricht aber dem AJAX-Prinzip.
 * @param string uri URI des aufzurufenden AJAX-Servers
 * @param object objData JS-Objekt mit den Daten, die an den AJAX-Server gesendet werden sollen
 * @param function ResponseHandler Name der Funktion die die Antworten vom AJAX-Server empfangen soll
 * @return
 */
function blockingHttpRequest(uri, objData, ResponseHandler) {
  var ajax = new AjaxClass;
  ajax.blockingHttpRequest(uri, objData, ResponseHandler);
}

/**
 * class AjaxClass()
 *
 * Klasse die von httpRequest() benutzt wird, um einen XMLHttpRequest abzusetzen.
 */
function AjaxClass() {
// ....

	/**
	 * __init()
	 *
	 * Private Funktion zum Initalisieren der Daten
	 *
	 * @param uri - URI der abzurufenden Seite
	 * @param value - Wert des Parameters
	 * @param targetID - ID des Elements, dass die Ausgabe anzeigen soll
	 */
	function __init(uri, objData, ResponseHandler)
	{
		// Default-Postfix
		var postfix = "?", completeURI;

		//alert('request absetzen');
		externalResponseHandler = ResponseHandler;

		// Ueberpruefen, welches Anhaengsel wir an die URI pasten muessen
		// URI der Form http://domain/?data1=wert1... => ?-Postfix
		if (uri.match(/?/)) {
		  postfix = "&";
		}

		// Komplette URI zusammenbauen
		this.completeURI = uri + postfix + 'params=' + JSON.stringify(objData);
	}

	/**
	 * AjaxClass_blockingHttpRequest()
	 *
	 * Blockierender AJAX-Aufruf / ***NICHT*** synchron. Wird teilweise benötigt für Events.
	 *
	 * @param uri - URI der abzurufenden Seite
	 * @param value - Wert des Parameters
	 * @param targetID - ID des Elements, dass die Ausgabe anzeigen soll
	 */
	function AjaxClass_blockingHttpRequest(uri, objData, ResponseHandler) {
		// initalisieren
		__init(uri, objData, ResponseHandler);

		//alert(completeURI);
		http.open('GET', completeURI, false);

		// Daten senden. In unserem Fall nix! / Dieser Aufruf blockiert!!!
		http.send(null);
		// Antwort handlen
		this.handleResponse();
	}
// ....

Die Methode httpRequest() besitzt den optionalen Parameter isBlocking. Sobald dieser auf TRUE gesetzt ist, wird die JavaScript-Ausführung “synchron” ausgeführt.
Soviel dazu.

In einer 3/4h Stunde ist hier in Weyhausen BV und mir knurrt der Magen ohne Ende… Freu mich schon auf die geschmierten Brötchen 😉

Leave a reply

Your email address will not be published.

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>