Wie kann ich mit Javascript eine Tabellenzeile dynamisch hinzufügen?

2 Antworten

Vom Fragesteller als hilfreich ausgezeichnet

Habe Dir ein kommentiertes jsFiddle erstellt. Stehe für Rückfragen zur Verfügung! http://jsfiddle.net/IgelJ/x7f070ne/1/

Das ist genau das, was ich gesucht habe. Jetzt habe ich jedoch noch ein kleines Problemchen ^^. Ich habe den Code so angepasst, dass es auf mein beispiel passt. Kann man zusätzlich zu den inputs auch jedes mal ein <tr><td></td></tr> erstellen? sonst verzieht es mir die ganze Tabelle. Ausserdem funkioniert das mit dem input_location tag nicht so, wie es bei jsfiddle klappt. Bei mir passiert einfach gar nichts. Ich habe den Code so reingeschrieben und dann 1x1 kopiert.

http://jsfiddle.net/x7f070ne/3/

PS: Was meinst du mit math.round()?

0
@giklo

Ich werde mir das fiddle mal ansehen.

Math.round() ist dafür gedacht, wenn Du später einen weiteren Input reinmachst, zB Doktortitel, aber vergisst, dass die Anzahl der Inputs geteilt durch 2 dann nicht mehr gerade ist! Also eine Vorsichtsmaßnahme für späteres, vergessliches Nacharbeiten. PS: math.round bedeutet zb aus 2,3 wird 2 und aus 4,67 wird 5.

0
@giklo

Ok ich hab herausgefunden, wieso bei mir das mit dem hinzufügen nicht funktioniert. Der Button ist innerhalb des Formulars... Sobald ich ihn rausnehme, geht der button.

Geht das auch irgendwie anders? Ich sehe keine Möglichkeit, den Button bei den Feldern zu plazieren, ohne dass er im <form> tag ist

0
@userfromberlin

Ich habs jetzt so gemacht wie im jsfiddle. Das funktioniert auch. Aber nur, wenn der Button nicht innerhalb des <form> Tags ist. Der Button sollte jedoch, damit man überhaupt draus kommt direkt bei den einzufügenden inputs befinden. Denn es gibt noch 15 andere Inputs die davor oder danach kommen.

0

Okey also irgendetwas mache ich immer noch falsch. Im JSfiddle funktioniert es. Aber egal wie ich es probiere, in meinem Skript funktioniert es nicht... Ich hab mir mal die Mühe gemacht und alles in JSfiddle geladen. und dort funkioniert es auch nicht. (Ich werde den Link hier aus privaten Gründen nicht posten).

In der Konsole bekomme ich immer folgende Fehlermeldung:

Uncaught NotFoundError: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.

Wo genau muss ich meinen Fehler suchen?

0
@giklo

Du darfst nicht body.insertBefore(...) oder document.insertBefore(...) wählen, sondern musst das direkte Elternelement vor den Punkt setzten Also:

<div id="vater"><div id="sohn"></div></div>
var tochter = //neues Element;
document.getElementById("vater").insertBefore(tochter, document.getElementById("sohn"));
0
@userfromberlin

Ok super so klappts ^^

Jetzt hab ich nur noch das Problem, dass die inputs immer zusammengepresst werden... Aber das krieg ich schon irgendwie selbst hin.

Vielen Dank ; )

1

Hallo! Du kannst diese Arbeit ein bischer leicher machen. Hier gibt es einige Beispiele mit dem Code http://webix.com/widget/datatable/. Du kannst das kostenlos download

Excel Liste immer oben eintragen, dann alles nach unten verschieben?

Ich möchte eine Liste erstellen, in der man immer in der ersten Zeile neue Informationen einträgt, wenn diese vier Felder alle gefüllt worden sind, soll diese und alle Zellen die unter denen sind eine Zeile herunter verschoben werden, sodass man wieder die erste Zeile frei hat. Hat da jemand eine Idee wie man das hin bekommt, oder eventuell eigene Tabelle, die er mir geben könnte, zum kopieren.

...zur Frage

HTML/PHP - Input-Daten von Formular auf (anderer) Seite als Text ausgeben?

Hallo Zusammen,

ich bin ziemlich neu in der PHP-Welt.

Daher jetzt schon einmal entschuldigung für evtentuelle schwammige Formulierungen ^^

Ich bin Momentan dabei eine HTML-Seite für einen befreundeten Alleinunterhalter zu schreiben.

Hierfür soll später bei Auftritten ein Tablet bereit stehen in dem die Gäste ihre Musikwünsche äußern können.

Hier gibt es 2 Text-Input-Felder, einmal mit dem Namen und einmal mit dem Musikwunsch.

HTML-Code:

<p>Dein Name:</p>
   <form name="FormularName" action="#">
        <input type="text" name="Name" size="20" required>
   </form>

<p>Dein Musikwunsch:</p>
   <form name="FormularWunsch" action="#">
        <input type="text" name="Wunsch" size="20" required><br><br><br>
        <input type="submit" value="Ausgabe" onClick="Ausgabe()">
   </form>

Diese verarbeite ich momentan in einem JavaScript zu einem Alert:

JavaScript-Code:

<script type"text/javascript">
     
    function Ausgabe() {
    alert (document.FormularName.Name.value +" w\u00fcnscht sich: "+document.FormularWunsch.Wunsch.value); }

</script>

Jetzt ist die Frage, wie ich die hier eingegeben Daten (entweder auf der selben oder auf einer zweiten Seite) in einer Liste ausgeben kann, damit der Musiker sieht was sich gewünscht wird.

Über Vorschläge und Antworten würde ich mich freuen

Gruß Fabio

...zur Frage

EÜR-Formular ausfüllen: was muß man bei Entnahmen u. Einlagen (Zeile 78/79) eintragen?

Beim ÜR Formular sollen die Zeile 78 Entnahmen und 79 Einlagen ausgefüllt werden. Welcher Wert ist hier anzugeben und wie wird er ermittelt ?

...zur Frage

Kann man ein Formular mit JavaScript absenden?

Ich habe ein HTML-Formular Range-Element für eine Lautstärke-Einstellung. Nach dem der Regler verschoben wurde, soll das Formular abgeschickt werden.

Der Sinn des ganzen ist dass die Änderungen der Lautstärke sofort übernommen solen und dem Anwender mit einem Beeb (der in der neuen Lautstärke wiedergegeben werden soll) bestätigt wird.

Das geht natürlich nur wenn ich in der Lage bin, das Formular nach einem "onmousup" auf dem Range-Element abzusenden.

Weiß jemand wie man das hinbekommt?

...zur Frage

Wie trage ich bei der Einkommensteuererklärung den AN-Anteil der Winterbauumlage ein?

Wir machen unsere Einkommensteuererklärung mit dem Elster- Formular. In der Anlage N muss man die Lohnsteuerbescheinigung ausfüllen. Leider ist irgendwie keine Zeile für die Winterbauumlage (steht auf der "Lohnsteuerkarte" fast ganz unten) vorgesehen. Wo kann ich diese eintragen? Vielen Dank

...zur Frage

Wo Umsatz/Gewinn in Elster online eintragen?

Ich habe ein kleines Nebengewerbe angemeldet und im Januar war es endlich soweit, dass ich meine Rechnung stellen konnte (für Dezember) und mein erstes Geld erhalten habe. Nun an der Stelle meine Frage, wo ich das beim Elster-Online-Formular eintrage? (Zeile?) Wenn sich damit jemand auskennen würde, wäre ich sehr dankbar!

...zur Frage

Was möchtest Du wissen?