Hans Wurst: hinzufügen und löschen von Input-Feldern

Beitrag lesen

Hier eine teils funktionsfähiges Script:

  
<html>  
 <head>  
  <style type="text/css">  
   body { margin:0px; padding:0px; text-align:center; }  
  </style>  
  
[code lang=javascript]   <script type="text/javascript">  
    function addElem() {  
     mainForm = document.forms[0]; // Form_Tag  
     anzElem  = mainForm.getElementsByTagName("input").length; // Anzahl bereits vorhandener Input-Elemente  
  
     newElem       = document.createElement("input"); // Erstelle neues Element ...  
     newElem.type  = "text"; // ... von Typ 'text' ...  
     newElem.name  = anzElem + 1; // ... und name = anzahl der Elemente + 1  
     newElem.id    = newElem.name; // id = name  
     newElem.value = "Feld #"+ newElem.name; // value setzen  
  
     mainForm.appendChild(newElem); // hinzufügen  
    }  
  
    function delElem() {  
     mainForm = document.forms[0]; // Form_Tag  
     elem = prompt("Bitte Nr. des Elements eingeben:"); // Nachfragen welche Nummer  
  
     mainForm.removeChild(document.getElementById(elem)) // Löschen!  
     sort(); // Sortieren  
    }  
  
    function sort() {  
     for(var i=3; i < mainForm.getElementsByTagName("input").length; i++) {  
      mainForm.getElementsByTagName("input")[i].name = i;  
      mainForm.getElementsByTagName("input")[i].id = i;  
      mainForm.getElementsByTagName("input")[i].value = "Feld #"+ i;  
     }  
    }  
   </script>

</head>
  <body>
   <form>
    <input type="button" name="" id="" value="Add" onclick="addElem();" />
    <input type="button" name="" id="" value="Delete" onclick="delElem();" />
    <br /><br />
  </form>
 </body>
</html>
[/code]

Du kannst Felder erzeugen (text), die sind bereits numeriert, aber erst ab #3.
Felder werden gelöscht, und neu sortiert, zum teil.
Du musst die Funktionen noch erweitert/anpassen, aber die Grundstruktur deiner Anforderung ist da. Da ich leider keine Zeit habe, musst du es vervollständigen! Das packst du schon ;)