JavaScript Formulardaten per POST mittels Ajax übergeben

digiTALE

Lt. Junior Grade
Registriert
Juli 2004
Beiträge
270
Hey hey,

irgendwie will das nicht so recht klappen mit meinem Ajax Script und bei der Suche
wurde ich auch nicht wirklich fündig was mir weiter helfen könnte.

Das Formular beinhaltet 5 Felder die im Script als POST-Daten übergeben werden
müssen. Wenn man auf den "Sende" Button klickt passiert auf den ersten Blick gar
nichts, nur wenn ich in die Fehlerkonsole im FF schaue steht eine Fehlermeldung zwecks
Umlauten "Nicht definierte Entität". Theoretisch funktioniert es, aber mit dem anzeigen
der Daten haut das nicht hin. Wo steckt also der Fehler?


Ajax:
PHP:
function loadContact()
{

	http_request.open("POST", "/kontakt/senden/1/", true);

	var name = document.getElementById("name").value;
	var email = document.getElementById("email").value;
	var telefon = document.getElementById("telefon").value;
	var betreff = document.getElementById("betreff").value;
	var nachricht = document.getElementById("nachricht").value;

	http_request.onreadystatechange = handleContact();
	http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
	http_request.send("name=" + name + "&email=" + email + "&telefon=" + telefon + "&betreff=" + betreff + "&nachricht=" + nachricht);

}

function handleContact()
{
	if (http_request.readyState == 4)
	{
		document.getElementById("form").innerHTML = http_request.responseText
	}
}


kontakt.php
HTML:
<form action="/kontakt/senden/" onsubmit="loadContact(); return false;" method="post">

	<div class="left">

		<label for="name">Name</label>

		<div><input id="name" type="text" class="txt" name="name" value="" maxlength="50" /></div>

		<label for="email">eMail Adresse</label>

		<div><input id="email" type="text" class="txt" name="email" value="" maxlength="50" /></div>

		<label for="telefon">Telefon-Nummer</label>

		<div><input id="telefon" type="text" class="txt" name="telefon" value="" maxlength="50" /></div>

		<label for="betreff">Betreff</label>

		<div><input id="betreff" type="text" class="txt" name="betreff" value="" maxlength="50" /></div>

	</div>


	<div class="right">

		<label for="nachricht">Nachricht</label>

		<div><textarea id="nachricht" name="nachricht" rows="10" cols="50" ></textarea></div>

		<div class="right"><input type="submit" value=" eMail absenden " class="submit" title=" eMail absenden " /></div>

	</div>


</form>

<div  id="form">
<?php

	if ( preg_match("/send/i", $_SERVER["REQUEST_URI"]) )
	{
		echo "Name = " . $_POST["name"];
		echo "eMail Adresse = " . $_POST["email"];
		echo "Telefon-Nummer = " . $_POST["telefon"];
		echo "Betreff = " . $_POST["betreff"];
		echo "Nachricht = " . $_POST["nachricht"];
	}


?></div>
 
Hast du mal über alert oder sonst was überprüft ob in 'http_request.responseText' überhaupt was drin steht?
 
Ich habe jetzt den "Onreadystate" angepasst und der bleibt bei "1" stehen,
also beim laden der Daten hat er wohl Probleme!?

PHP:
function loadContact()
{

	http_request.open('POST', 'kontakt.php?cat=senden&js=1', true);
	http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
	http_request.onreadystatechange = handleContact();
	http_request.send('name=test');

}

function handleContact()
{
	if (http_request.readyState == 1)
	{
		alert('lade (1)');
	}
	else if (http_request.readyState == 2)
	{
		alert('geladen (2)');
	}
	else if (http_request.readyState == 3)
	{
		alert('interaktiv (3)');
	}
	else if (http_request.readyState == 4)
	{
		document.getElementById("form").innerHTML = http_request.responseText;
	}
}
 
Zurück
Oben