Weitere Tabellenzeilen hinzufügen (per JS)

Computer: Software & Programmierung JavaScript & Script-Sprachen
#1

Hallo zusammen!

Ich habe eine Tabelle, die pro Zeile drei input-Felder hat. Auf Wunsch soll der Nutzer – durch drücken eines „+“-Buttons auf der rechten Seite – eine weitere Zeile mit input-Feldern erhalten, um weitere Daten einzutragen. Diese Zeile soll am Ende der Tabelle angehängt werden.

Das Skript, das ich bislang hierzu geschrieben habe, funktioniert leider noch nicht so, wie ich mir das gedacht habe. Es fügt bisher nur eine Zeile erfolgreich an, dann keine mehr. HTML & JS können unter folgendem Link eingesehen werden:

http://hirnverbrandt.kilu.de/iniCalc/

(Die Input-Felder müssen nummerierte IDs haben, damit ich sie später einzeln in ein Array einlesen kann.)

Hat jemand eine Ahnung, wo der (offensichtlich enthaltene) Denkfehler liegt? Ich brüte jetzt schon Stunden darüber, aber komme zu keinem Ergebnis. :frowning:

Beste Grüße,
bustard2k.

#2

Hey bustard,

Dass es nur eine Zeiloe hinzufügt ist recht logisch, da du die eine zusätzliche Zeile ja schon fest im html-code hast, aber keine weiteren.

Ich würde dir stark abraten es alles quasi „textuell“ zu machen und dir eher das erzeugen der elemente per javascript zu empfehlen, das klappt dann in etwa so:

var newRow = document.createElement(„tr“);
newRow.setAttribute(„id“, „addLine“+numberOfLines);

var td1 = document.createElement(„td“);
// td1.setAttribute(„align“, „center“);
// usw. musst dir mal bei selfhtml die javascript node API ansehen
td1.innerHTML = „“;

var td2 = document.createElement(„td“);
td2.innerHTML = […];
// usw.

newRow.appendChild(td1);
newRow.appendChild(td2);
[…]

document.getElementById(„myTableID“).tBodies[0].appendChild(newRow);
// bei mir war es die einzige möglichkeit das zum laufen zu bringen
// indem ich das tBodies array benutzt habe… also einfach innerhalb
// deiner Tabelle nochmal den -Tag reintun dann sollte es
// funktionieren

Ich hoffe das ist hilfreich…
Wenn es noch Probleme gibt einfach bescheid sagen!

Liebe Grüße
iF00L

#3

hi
informier dich mal über DOM, über dieses können ohne umständliche codeschnipsel direkt neue elemente erzeugt werden:
http://de.selfhtml.org/javascript/objekte/node.htm
lg

#4

Hallo, ihr beiden!

Danke für eure Tipps! Ihr habt wohl Recht, der Fehler liegt wahrscheinlich irgendwo in dem Code-Wirrwarr; ich werd’ mich in der Tat mal schlau über die direkte Erzeugung machen. Falls dabei große Problem auftreten, sehen wir uns wieder hier. :wink:

Mit Dank und Gruß,
bustard2k.

#5

JQuery oder mootools sind gute frameworks um dom manipulation recht einfach zu halten.