Formular mit eingabefeldern erweitern

Moin,

Ich möchte gerne ein Eingabeformular erzeugen welches bei Bedarf noch um
weitere Eingabefelder erweitert wird und diese dann auch
weiterverabeitet werden können (php z. B.)

Es soll also das Feld "activity_01" geclont werden und einen neuen Namen
bekommen "activity_02".

Und das ganze beliebig - ggf. können erzeugte Felder auch wieder
geschlossen werden.

Für jede Hilfe bin ich dankbar.

Netten Grüße,
Ben

Hier ist mein (einfaches) Formular:

<form name="customer_data" method="post" action="form.php?save=data">

<p>Name
<input name="surname" type="text" id="surname">
</p>

<p>T&auml;tigkeiten
<input name="activity_1" type="text" id="activity_1">
[ weitere T&auml;tigkeiten eingeben]
</p>

<p>
<input type="submit" name="save" value="speichern">
</p>

</form>

Ben Butschko wrote:

Ich möchte gerne ein Eingabeformular erzeugen welches bei Bedarf noch um
weitere Eingabefelder erweitert wird und diese dann auch
weiterverabeitet werden können (php z. B.)

Es soll also das Feld "activity_01" geclont werden und einen neuen Namen
bekommen "activity_02".

form name="customer_data" method="post" action="form.php?save=data"

p>Name
input name="surname" type="text" id="surname"
/p

p>T&auml;tigkeiten
input name="activity_1" type="text" id="activity_1"
[ weitere T&auml;tigkeiten eingeben]
/p

<script type="text/javascript">
function addInput (inputButton, prefix) {
if (inputButton.parentNode && inputButton.previousSibling && typeof
inputButton.cloneNode != 'undefined') {
var lastInput = inputButton;
do {
lastInput = lastInput.previousSibling;
}
while (lastInput.nodeType != 1);
var newInput = lastInput.cloneNode(false);
var index = new RegExp(prefix + "(\\d+)$").exec(newInput.name)[1];
newInput.name = newInput.id = prefix + (Number(index) + 1);
inputButton.parentNode.insertBefore(newInput, inputButton);
}
}
</script>

<p>Tätigkeiten
<input name="activity_1" type="text" id="activity_1">
<input type="button" value="weitere Tätigkeiten eingeben"
onclick="addInput(this, 'activity_');">
</p>
--

Martin Honnen
http://JavaScript.FAQTs.com/

"Martin Honnen" <mahotrash (AT) yahoo (DOT) de> schrieb im Newsbeitrag
news:4739b1e9$0$16664$9b4e6d93 (AT) newsspool3 (DOT) arcor-online.net...

script type="text/javascript"
function addInput (inputButton, prefix) {
if (inputButton.parentNode && inputButton.previousSibling && typeof
inputButton.cloneNode != 'undefined') {
var lastInput = inputButton;
do {
lastInput = lastInput.previousSibling;
}
while (lastInput.nodeType != 1);
var newInput = lastInput.cloneNode(false);
var index = new RegExp(prefix + "(\\d+)$").exec(newInput.name)[1];
newInput.name = newInput.id = prefix + (Number(index) + 1);
inputButton.parentNode.insertBefore(newInput, inputButton);
}
}
/script

p>Tätigkeiten
input name="activity_1" type="text" id="activity_1"
input type="button" value="weitere Tätigkeiten eingeben"
onclick="addInput(this, 'activity_');"
/p

Moin,

vielen Dank! Das einzige, was ich noch nicht so schön finde ist das die
jeweiligen Felder nebeneinander erscheinen und nicht untereinander.
Das bekomme ich aber irgendwie hin.

Netten Gruß
Ben