So,
im Prinzip, habe ich jetzt ein funktionierendes Grundgerüst. Allerdings habe ich noch ein kleines Problem:
Das Script, soll ja beim aktivieren ein PHP-Script ausführen, nur habe ich in diesem Script einen Array der sich mit dem aktivieren mehrerer Checkboxen verändern soll, der Inhalt geht jedoch logischer weise bei jeder Aktivierung einer Checkbox verloren. Wie kann ich das umgehen? Die einzige wie ich finde etwas unelegante Lösung die mir einfällt wäre eine SESSION zu starten.
Hier meine Scripte:
index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Ajax Beispiel 002</title>
<script type="text/javascript">
<!--
var request = false;
// Request senden
function setRequest(value) {
// Request erzeugen
if (window.XMLHttpRequest) {
request = new XMLHttpRequest(); // Mozilla, Safari, Opera
} else if (window.ActiveXObject) {
try {
request = new ActiveXObject('Msxml2.XMLHTTP'); // IE 5
} catch (e) {
try {
request = new ActiveXObject('Microsoft.XMLHTTP'); // IE 6
} catch (e) {}
}
}
// überprüfen, ob Request erzeugt wurde
if (!request) {
alert("Kann keine XMLHTTP-Instanz erzeugen");
return false;
} else {
var url = "filter.php";
// Request öffnen
request.open('post', url, true);
// Requestheader senden
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// Request senden
request.send('test='+value);
// Request auswerten
request.onreadystatechange = interpretRequest;
}
}
function bestaetigen(value) {
// Request erzeugen
if (window.XMLHttpRequest) {
request = new XMLHttpRequest(); // Mozilla, Safari, Opera
} else if (window.ActiveXObject) {
try {
request = new ActiveXObject('Msxml2.XMLHTTP'); // IE 5
} catch (e) {
try {
request = new ActiveXObject('Microsoft.XMLHTTP'); // IE 6
} catch (e) {}
}
}
// überprüfen, ob Request erzeugt wurde
if (!request) {
alert("Kann keine XMLHTTP-Instanz erzeugen");
return false;
} else {
var url = "auswertung.php";
// Request öffnen
request.open('post', url, true);
// Requestheader senden
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// Request senden
request.send('test='+value);
// Request auswerten
request.onreadystatechange = interpretRequest;
}
}
// Request auswerten
function interpretRequest() {
switch (request.readyState) {
// wenn der readyState 4 und der request.status 200 ist, dann ist alles korrekt gelaufen
case 4:
if (request.status != 200) {
alert("Der Request wurde abgeschlossen, ist aber nicht OK\nFehler:"+request.status);
} else {
var content = request.responseText;
// den Inhalt des Requests in das <div> schreiben
document.getElementById('content').innerHTML = content;
}
break;
default:
break;
}
}
//-->
</script>
</head>
<body>
<input name="test" id="check" type="checkbox" value="" onchange="setRequest('max')" />
<input name="test" id="check" type="checkbox" value="" onchange="setRequest('susi')" />
<input name="test" id="check" type="checkbox" value="" onchange="setRequest('heinz')" />
<a href="javascript:bestaetigen('bestaetigen')">Änderungen Bestätigen</a>
<div id="content">testtest</div>
</body>
</html>
filter.php
<?php
header('Content-Type: text/html; charset=utf-8'); // sorgt für die korrekte Kodierung
header('Cache-Control: must-revalidate, pre-check=0, no-store, no-cache, max-age=0, post-check=0'); // ist mal wieder wichtig wegen IE
$filter = array("1","2","3","4");
$wert = strtoupper($_POST['test']);
if ($count == "" OR $count < 1)
{
$count = 1;
}
if ($wert == "SUSI")
{
$filter[] = $wert;
echo $filter[4];
$count ++;
echo $count;
}
if ($wert == "MAX")
{
$filter[] = $wert;
echo $filter[4];
}
if ($wert == "HEINZ")
{
$filter[] = $wert;
echo $filter[4];
}
echo "__".$wert;
?>
auswertung.php
<?php
header('Content-Type: text/html; charset=utf-8'); // sorgt für die korrekte Kodierung
header('Cache-Control: must-revalidate, pre-check=0, no-store, no-cache, max-age=0, post-check=0'); // ist mal wieder wichtig wegen IE
$name = strtoupper($_POST['test']);
echo $name;
?>