Codeschnipsel - AJAX Bewertung


Hier ein eingesendeter Code von Joscha Scherder, dieser eine Ajax Bewertung realisiert.

Das Javascript (ajax.js):

Code:
// Ajax Bewertung (Codeschnipsel)
// (C) 2008 By Joscha Scherder
// www.123-Board.de
// Dieser Hinweis darf nicht entfernt werden.
// Downloaded at PA-S.de
 
function CreateRequestObject()
{
	if(navigator.appName == "Microsoft Internet Explorer")
	{
		Obj = new ActiveXObject("Microsoft.XMLHTTP");
	}else{
		Obj = new XMLHttpRequest();
	}
 
	return Obj;
}
 
function Start()
{
	var i = 1;
 
	while (i <= MaxValue)
	{
		var Bewertung = document.getElementById('Bewertung');
		Bewertung.innerHTML = Bewertung.innerHTML + '<img id = "' + i + '" src="images/off.gif" OnMouseOut="Off();" OnMouseOver="On(' + i + ');" OnClick="DoIt(' + i + ');">';
		i++;
	}
 
	var i = 1;
 
	while (i <= StartValue)
	{
		document.getElementById(i).src = 'images/on.gif';
		i++;
	}
}
 
function Off()
{
	var i = 1;
 
	while (i <= MaxValue)
	{
		document.getElementById(i).src = 'images/off.gif';
		i++;
	}
}
 
function On(Points)
{
	var i = 1;
 
	while (i <= Points)
	{
		document.getElementById(i).src = 'images/on.gif';
		i++;
	}
}
 
function DoIt(Punkte)
{
	var Obj = CreateRequestObject();
 
	Obj.open('GET', 'bewertung.php?punkte=' + Punkte);
 
	Obj.onreadystatechange = function()
	{
		if(Obj.readyState == 4 && Obj.status == 200)
		{
			var Content = Obj.responseText;
			document.getElementById('Bewertung').innerHTML = Content;
		}
	};
	Obj.send(null);
}

Das PHP-Script, das die Daten verarbeitet (bewertung.php):

Code:
<?php
 
// Ajax Bewertung (Codeschnipsel)
// (C) 2008 By Joscha Scherder
// www.123-Board.de
// Dieser Hinweis darf nicht entfernt werden.
// Downloaded at PA-S.de
 
if(isset($_GET['punkte']) && !empty($_GET['punkte']))
{
	echo 'Du hast erfolgreich '.strip_tags($_GET['punkte']).' Punkte als Bewertung abgegeben.';
}
?>


Die Grafiken: (images/off.gif) (images/on.gif)

Beispiel Eingabemaske (example.htm):

Code:
<!--
// Ajax Bewertung (Codeschnipsel)
// (C) 2008 By Joscha Scherder
// www.123-Board.de
// Dieser Hinweis darf entfernt werden.
-->
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title>Ajax - Bewertung | www.123-Board.de</title>
    <meta http-equiv='content-type' content='text/html; charset=iso-8859-1'>
    <script type='text/javascript' src="ajax.js"></script>
    <script type='text/javascript'>
	var MaxValue = 5; // Wieviele Punkte können vergeben werden?
	var StartValue = 3; // Wieviele Punkte soll das Dokument anzeigen?
    </script>
  </head>
<body OnLoad="Start();">
  <div id="Bewertung" OnMouseOut="this.innerHTML = ''; Start();"></div>
</body>
</html>

Download aller Dateien: Hier klicken!
Demonstration: Hier klicken!

Beachten Sie: Wir übernehmen keinerlei Haftung für irgendwelche Schäden, Ausfälle oder sonstigen Geschehnissen.
Alle Angaben sind ohne Gewähr, Sie handeln auf eigenes Risiko!
Alle genannten Soft- und Hardwarebezeichnungen sowie Markennamen sind Eigentum ihrer jeweiligen Inhaber und unterliegen im Allgemeinen warenzeichen-, marken- oder patentrechtlichem Schutz.
Alle Rechte vorbehalten