JavaScript Ajax Funktionen

Aus ITwiki
Version vom 6. März 2008, 23:52 Uhr von WikiSysop (Diskussion | Beiträge) (Die Seite wurde neu angelegt: Mit den Funktionen SendForm() und SendFormArray() können Beispielsweise PHP Seiten im Hintergrund abgerufen und deren Ausgabe zurückgegeben werden. <source lang="Jav...)

(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)
Wechseln zu: Navigation, Suche

Mit den Funktionen SendForm() und SendFormArray() können Beispielsweise PHP Seiten im Hintergrund abgerufen und deren Ausgabe zurückgegeben werden.

function XmlHttpObject() {
	var xmlhttp=false;
	/*@cc_on @*/
	/*@if (@_jscript_version >= 5)
	// JScript gives us Conditional compilation, we can cope with old IE versions.
	// and security blocked creation of the objects.
	try	{
		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
		}
	catch(e){
		try	{
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
			}
		catch(E){xmlhttp = false;}
		}
	@end @*/
	if(!xmlhttp && typeof XMLHttpRequest != 'undefined')
		{xmlhttp = new XMLHttpRequest();}
	return xmlhttp;
	}



function EncodeUmlaute(string) {
	var a = new Array("ä", "%E4", "ö", "%F6", "ü", "%FC", "Ä", "%C4", "Ö", "%D6", "Ü", "%DC", "ß", "%DF");
	for(var i=0; i<a.length; i+=2) {
		while(string.indexOf(a[i])>-1) {
			var p = string.indexOf(a[i]);
			string = string.substr(0, p) + a[i+1] + string.substr(p+1, string.length);
			}
		}
	return string;
	}
	


function SendForm(callback, action) {
	var xml="", a = SendForm.arguments;

	for(var i=2; i<a.length; i+=2)
		xml = xml + a[i] +"="+ escape(a[i+1]) +"&";
	var xmlhttp = XmlHttpObject();
	xmlhttp.open("POST", action, true);
	xmlhttp.onreadystatechange = function()
		{
		if(xmlhttp.readyState==4 && xmlhttp.status==200 && callback!=null) {
			callback(xmlhttp.responseText);
			xmlhttp = null;
			}
		}
        xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	xmlhttp.send(xml.substring(0, xml.length-1));
	}


function SendFormArray(callback, url, action, key, val) {
	var xml="";

	for(var i=0; i<key.length; i++)
		xml = xml + key[i] +"="+ escape(val[i]) +"&";

	xml = xml + "action="+ action;

	var xmlhttp = XmlHttpObject();
	xmlhttp.open("POST", url, true);
	xmlhttp.onreadystatechange = function()
		{
		if(xmlhttp.readyState==4 && xmlhttp.status==200 && callback!=null) {
			callback(xmlhttp.responseText);
			xmlhttp = null;
			}
		}
        xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	xmlhttp.send(xml);
	}

Aufbau der Funktion SendForm()

  • Der erste Parameter definiert die Funktion, die den Rückgabewert verarbeitet.
  • Der zweite Parameter die URL, die abgerufen werden soll.
  • Alle weiteren Parameter bestimmen die anzuhängenden Post Variablen für die URL. Dabei wird erst der Name der Variable und dann der Wert angegeben. Die kann beliebig für mehrere Variablen wiederholt werden.


Hier ein Beispiel für die Verwendung

SendForm(Ajax_callback, "userlist.php", "id", "10", "sort", "asc");

function Ajax_callback(res)
{
	alert(res);
}