JavaScript - Formularfelder hinzufügen?

Guten Morgen,

ich suche einen Weg, um einem HTML-Formular ein weiteres "Paket" an Feldern hinzuzufügen.

"Paket" soll beinhalten:

<label style="float: left;">Antwort%: <input type="text" name="antwort%" </label><fieldset><input type="radio" id="true%" name="status" value="1"><label for="true%">Richtig</label> <input type="radio" id="false%" name="status" value="0"><label for="false%">Falsch</label></fieldset><br>

...dabei sollen die %-Zeichen durch einen Zähler ersetzt werden -> Neue Feld = counter++

Gibt es dafür ein einfaches(!) Skript...

Will nur einen Button zum hinzufügen... im Backend kann ich mit PHP prüfen ob von den 10 hinzugefügten Feldern auch wirklich alle ausgefüllt sind.

Wäre sehr dankbar wenn mir jemand helfen könnte

Skill:

HTML - ja

PHP - ja

JavaScript- Nein :(

Answer 1

[xxxReaver]

Ist alles nicht so schwer, man muss nur neugierig bleiben und viel googlen :)

https://www.w3schools.com/js/default.asp

Answer 2

[Suboptimierer]

Ich kann PHP schlecht testen und möchte mir für die Frage nicht extra eine Umgebung installieren, aber das könnte in etwa so aussehen:

<?php
for($i=0;$i<10;$i++)
{
  echo "<label style=\"float: left;\">Antwort$i:</label><input type=\"text\" name=\"antwort$i\" />\n";
  echo "<fieldset>\n";
  echo "<input type=\"radio\" id=\"true$i\" name=\"status\" value=\"1\"><label   for=\"true$i\">Richtig</label>\n"; 
  echo "<input type=\"radio\" id=\"false$i\" name=\"status\" value=\"0\"><label   for=\"false$i\">Falsch</label>\n";
  echo "</fieldset><br/>\n";
}
?>

Woher ich das weiß: Berufserfahrung – Programmierer

Comments

[XentriX5526]

dachte schon an eine Lösung im Bereich JavaScript...

Möchte im HTML-dokument einen Button, der bei klick einmal dieses "Paket" hinzufügt.

Beispiel "1. Klick":

<label style="float: left;">Antwort1: <input type="text" name="antwort1" </label><fieldset><input type="radio" id="true1" name="status1" value="1"><label for="true1">Richtig</label> <input type="radio" id="false1" name="status" value="0"><label for="false1">Falsch</label></fieldset><br>

Beispiel "2. Klick":

<label style="float: left;">Antwort2: <input type="text" name="antwort2" </label><fieldset><input type="radio" id="true2" name="status2" value="1"><label for="true2">Richtig</label> <input type="radio" id="false2" name="status" value="0"><label for="false2">Falsch</label></fieldset><br>

[Suboptimierer]

@XentriX5526

In JavaScript ist es etwas aufwändiger. Du erzeugst das Element und hängst es an einen Knoten. Das Prinzip, ne Schleife darüber zu legen, bleibt gleich.

for(i=0;i<10;i++)
{
  ele = document.createElement("input");
  ele.setAttribute("id", "input"+i);
  //...
  document.getElementById("meinDiv").appendChild(ele);
}

[XentriX5526]

@Suboptimierer

Klingt logisch, nur leider habe ich von JavaScript keine Ahnung. Gibt es ein Portal, wo man solche Mikro-Codes gegen ein Taschengeld in Auftrag geben kann?

[Suboptimierer]

@XentriX5526

Keine Ahnung. Ich mache das nur hobbymäßig.