✔ Erweitertes Formular

P

polly109

Grünschnabel
Hi,

ich möchte bei einem Formular mit Klick auf einen Button Textfelder und Checkboxen hinzufügen. Leider habe ich nur sehr geringe Vorkenntnisse von JavaScript.

Ich habe jetzt bereits in einer Funktion mit dem übergebenen Formular (oder so****) "objec t"mit

object.parentNode.cloneNode(true);

die Felder geclont und mit

object.form.appendChild(tmpNode);

ausgegeben

Die Frage ist, wie spreche ich neu erzeugte Felder an, um die Daten auszulesen?

Gruß
 
Gegenfrage. Ist die maximale Anzahl vorher irgendwie festgelegt? Dann könntest du die Felder erstmal einfach mit CSS ausblenden!?

Oder vielleicht so:

Javascript: 
<script language="javascript" type="text/javascript">
var anzahl_text = 1;
function feld_plus(){

	anzahl_text++;
	document.getElementById("formular").innerHTML =
		document.getElementById("formular").innerHTML +
		"<br />" +
		"<input type='text' name='feld1" + anzahl_text + "' value='Textfeld " + anzahl_text + "' size='20' maxlength='50' />";
}
</script>
HTML: 
<div id="formular">
	<input type="text" name="feld1" value="" size="20" maxlength="50" />
</div>
<input type="button" name="plus" value="Plus" onclick="feld_plus()" />
 
Auf welcher Seite willst du die denn auslesen? clientseitig mit JavaScript oder serverseitig? Also am besten ist es wohl, wenn du folgende Syntax nutzt:
HTML: 
<form method="post" action="">
  <div>
    <input type="text" name="name[]" />
    <input type="number" name="alter[]" />
  </div>
  <div>
    <input type="text" name="name[]" />
    <input type="number" name="alter[]" />
  </div>
</form>
Wenn du jetzt serverseitig beispielsweise mit PHP die Daten abfragst, dann erhältst du jeweils ein Array:
PHP: 
$namen = $_POST['name']; # Array
$alter = $_POST['alter']; # Array
 
Vielen das mit dem Hinzufügen verstehe ich. Wie könnte ich denn jetzt eins von den Elementen wieder mit Klick auf einen Button entfernen? Die Anzahl könnte vorher festgelegt sein. Wir haben jetzt einen String zusammengefügt, kann man davon jetzt wieder etwas streichen?

Eigentlich eher clientseitig. Das mit dem PHP verstehe ich noch weniger. Trotzdem danke :)
 
Wie meinst du das hier:
Wir haben jetzt einen String zusammengefügt, kann man davon jetzt wieder etwas streichen?
Zum Vergrößern anklicken....

Um ein Element wieder zu entfernen, muss es ja irgendwie gekennzeichnet/markiert werden. sind dazu die Checkboxen gedacht?

Aber wie oben schon geschrieben würde ich es vermutlich mit CSS ein- und ausblenden wenn schon im Vorfeld feststeht wieviele Textfelder es wirklich sind..
 
Javascript: 
	document.getElementById("formular").innerHTML =
		document.getElementById("formular").innerHTML +
		"<br />" +
		"<input type='text' name='feld1" + anzahl_text + "' value='Textfeld " + anzahl_text + "' size='20' maxlength='50' />";

An der Stelle mein ich das mit dem String. An den ursprünglichen wird ja einfach noch ein Textfeld im HTML-Code drangehängt. Um eine zu entfernen dachte ich könnte man von diesem String wieder etwas wegnehmen?

Mit CSS habe ich mich halt noch gar nicht beschäftigt ;)
Nochmal danke
 
Ist eigentlich ganz einfach:

Javascript: 
<script language="javascript" type="text/javascript">
function visible(nr){
	if (document.getElementById("text" + nr).style.display == "inline"){
		document.getElementById("text" + nr).style.display = "none";
		document.getElementById("feld" + nr).innerText = "Einblenden";
	} else{
		document.getElementById("text" + nr).style.display = "inline";
		document.getElementById("feld" + nr).innerText = "Ausblenden";
	}
}
</script>

HTML: 
<input type="text" name="text1" id="text1" value="Textfeld 1" />
<br />
<input type="text" name="text2" id="text2" value="Textfeld 2" style="display: inline;"/>&nbsp;<span id="feld2" onclick="visible(2)">Ausblenden</span>
<br />
<input type="text" name="text3" id="text3" value="Textfeld 3" style="display: inline;" />&nbsp;<span id="feld3" onclick="visible(3)">Ausblenden</span>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück