Das Rad nicht immer neu erfinden: Ajax Abfrage

The following two tabs change content below.

• Bio
• Neueste Artikel

Sascha Kaufmann

Neueste Artikel von Sascha Kaufmann (alle ansehen)

• Gefunden bei YouTube: Assassins Creed Valhalla Review | Was taugt der neue Teil? | #ACValhalla #LikeAViking - 11. November 2020
• Gefunden bei YouTube: DreamDasher | sponsored by indieboost - 11. November 2020
• Gefunden bei YouTube: Assassin’s Creed Valhalla Cosplay part 1 | Teil 1 der Eivor Weste - 11. November 2020

Hallo erstmal.

Ja ich weiß Programmieren interessiert hier wahrscheinlich die wenigsten, aber ich für meinen Teil will gerne mein Wissen weiter geben. Also wird es hier wohl zukünftig mehr Artikel in den Bereich der Programmierung geben.

Heute kommen wir mal zu einer Geschicht aus meiner Vergangenheit.

PHP und Javascript hab ich mir ja immer nur selber beigebracht. Aus diversen Quellen aus dem Internet. Nur mit dem Internet ist das ja so eine Sache, entweder man erkennt direkt das Beste und einfachste oder vielleicht auch nicht.

Naja ich suchte also einen Code der bestimmte Seiteninhalte neu läd ohne die ganze Seite immer wieder komplett neu zu laden. Das hatte ich irgendwo schon einmal gesehen. Und aus meinem damaligen Wissen, wusste ich das wenn dann nur Javascript-Code Seiten im nachhinein ändern kann (damals hatte ich selber noch keine Ahnung von JS).

Also begab ich mich auf die Suche nach einem Codebeispiel. Aber jetzt kommen wir mal zu dem eigentlichen Titel dieses Beitrags. Das Rad nicht immer neu erfinden.

In unseren Beispiel Javascript soll eine Datei alle 1 sek. neu geladen werden (Es zeigt Uhrzeit und verschieden Berechnungen mit Zeit an) und in einem Div angezeigt werden. Ausführlich nur der JS(/AJAX) Code:

var timer = 1000;

function AJAX(div, pfad) {
	var req = null;
	try {
		req = new XMLHttpRequest();
	}
	catch (ms) {
		try {
			req = new ActiveXObject('Msxml2.XMLHTTP');
		}
		catch (nonms) {
			try {
				req = new ActiveXObject('Microsoft.XMLHTTP');
			}
			catch (failed) {
				req = null;
			}
		}
	}
	if (req == null) alert('Error creating request object!');
	req.open("GET", pfad, true);
	req.onreadystatechange = function(){
		switch (req.readyState) {
			case 4:
				if (req.status!=200) {
					document.getElementById(div).innerHTML='Fehler: '+req.status;
				}
				else{
					document.getElementById(div).innerHTML=req.responseText;
				}
				break;
			default:
				return false;
				break;
		}
	};
	req.setRequestHeader('Content-Type','application/x-www-form-urlencoded');//'text/plain');//
	req.send(null);
	setTimeout("AJAX('" + div + "', '" + pfad+ "')", timer);
	return req;
}

function start() {
	AJAX('ausfuehr', 'zeit.php');
}

start();

Wie man sicht eigentlich nur Copy&Paste und wenige Änderungen sind von nöten. Aber was wenn man parameter dran hängen will? Genau dann wird req.open("POST") verwendet statt "GET" und die parameter werden noch irgendwie daran gehängt. Soetwas würde man machen wenn man das Rad neu erfindet. Weil das gibt es so bestimmt schon irgendwie als Paket! Kommen wir jetzt also zu dem eigentlich Thema Framworks.
Meiner Meinung nach sind Frameworks ne schöne Geschichte... Die erleichtern die Arbeit enorm. Solange man nichts ganz besonders will... Obriger Code wäre ungefähr so:
var timer = 1000;

function AJAX(div, pfad) {
	$('#'+div).load(pfad);
	setTimeout("AJAX('" + div + "', '" + pfad+ "')", timer);
	return req;
}

function start() {
	AJAX('ausfuehr', 'zeit.php');
}

start();

Theoretisch kann man sogar noch mehr sparen, weil es auch direkt eine Funktion gibt für das starten bei Dokument Load.
var timer = 1000;

function AJAX(div, pfad) {
	$('#'+div).load(pfad);
	setTimeout("AJAX('" + div + "', '" + pfad+ "')", timer);
	return req;
}

$(document).ready(
	AJAX('ausfuehr', 'stemlpelungen_zeit.php');
}

Natürlich kann man jetzt noch den Timer direkt in die Funktion schreiben anstelle von der variable aber das muss jeder selber wissen wie er das gerne hätte (vielleicht gibt es ja mehrer Befehle die ausgeführt werden sollen...
So um auch etwas persönliches in diesen Beitrag zu erwähnen, ich selbst mag Frameworks mittlerweile ganz gerne. Aber meiner Meinung nach sollte man erst mal wissen wie man das Rad neu erfindet bevor man einfach fertiges hinnimmt. Gut das mache ich selber auch nicht bei jedem Stück Code wo ich keine Ahnung habe, aus Zeitgründen. Aber ich denke das wäre ein besser Weg.
EDIT: Eigentlich braucht man das start(); oben nicht soweit ich informiert bin aber ich dachte ich nehme es trotzdem mal rein... Also eigentlich hatte ich nicht dran gedacht und es war so in meinem Beispielcode...