Ajax Funktion flexibel nutzen (Formular)

ihrschweine

Mitglied
Hallo zusammen,

ich hab da mal wieder ein kleines Problem welches sicherlich den einen oder anderen zum lachen bringt, ich aber für Hilfe sehr dankbar wäre.

Ich habe diesen Code, der ein Formular ausgibt, welches mit Ajax arbeitet. Gebe ich den Text in das Input und drücke auf den Submit Button passiert auch genau das was ich haben möchte. Der Text landet in der Datei und die Seite macht kein Reload.

Das Problem ist nun das ich mal 1 Formular habe, aber auch 3 vorhanden sein können, wovon jeder ein eigenes Input Feld, eine eigene datei, sowie Submit Button besitzen sollte. Den Dateiname würde ich über ein "Hidden" Feld übergeben.

Das Script im Head Bereich spricht aber direkt das Formular "ajax" an, nun würden die anderen zwei "ajax2" und "ajax3" heißen. Und die Datein dann, in der der Text gesichert werden soll auch "datei2" und "datei3".

Meine Frage ist nun, was kann ich tun, damit ich nur diesen kleinen Code oben habe aber dennoch alle unterschiedlichen Formulare damit arbeiten können?

Hier ist mal der Code
test.php
Code:
<head>

<script src="ajax.js" type="text/javascript"></script>
<script language="JavaScript">

	function Write(url, content)	// url is the script and data is a string of parameters
	{ 
		var xhr = createXHR();

		xhr.onreadystatechange=function()
		{ 
			if(xhr.readyState == 4)
			{
				// nothing for now
				// alert("sent " + url + " " + content);
			}
		}; 
		xhr.open("POST", url, true);		
		xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		xhr.send(content); 
	} 


	function submitForm()
	{ 
		var content = document.ajax.sentence.value;
		var data = document.ajax.data.value;
		Write("data.php", "file="+ data +".txt&content=" + content);
		var storing = document.getElementById("storage");
		storing.innerHTML = "<p>Gespeichert, <b><a href='data.txt' target='_parent'>Schauen</a></b>. ";
	} 

</script>

</head>

	
<body bgcolor="#FFFFFF">
<FORM name="ajax" method="POST" action="">

<input type="text" name="sentence" value="1" size="80">

<input name="data" value="data" type="hidden">

<INPUT type="button" value="Submit"  ONCLICK="submitForm()">
</form>
<div id="storage"> Nothing for now. </div>	

</body>
</html>

data.php
Code:
$fp = @fopen($_POST[file],'w+'); 
flock($fp, 1); 
fputs($fp, $_POST['content']); 
fclose($fp);

Mit freundlichen Grüßen
 
Moin,

das geht recht bequem :)

Übergebe der Funktion eine Referenz auf das betreffende Formular
Code:
ONCLICK="submitForm(this.form)"
(alle Formularelemente besitzen von Hause aus eine Eigenschaft form, eine Referenz auf das <form>-Element, dem sie zugehörig sind)


Die Function lässt du es entgegennehmen:
Code:
function submitForm(formular)

In der Funktion selbst musst du die bisherigen statischen Referenzen auf das eine Formular ersetzen, bspw.:
Code:
document.ajax.sentence.value

durch die übergebene Referenz:
Code:
formular.sentence.value
 

Neue Beiträge

Zurück