• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Dynamische Tabelle

Status
Für weitere Antworten geschlossen.

Irminar

Neues Mitglied
Hi @ all,

ich habe eine frage bezüglich einer aufgabe.
Ich habe eine Tabelle in der zur Zeit nur die Kopfzeile existiert:

Attribute Name | Attribute Type | Data type | Description | indices

Nun soll ich mittels javascript dafür sorgen das per Button die möglichkeit
neue Zeilen zu erstellen und diese dann mit z.B. Attribute Name Type usw.
zu befüllen.

Hat wer eine idee wie ich das realieren kann?

thx schonma

LG Irmi :)
 
Ähm.. neue Tabellenzeilen und -zellen erzeugen?
Ja

wie oben hat man diese Kopfzeilen
darüber is ein Button wenn man auf diesen drückt
soll eine neue zeile mit den gleichen spalten kommen in denen er dann
seine eintragung machen kann
z.B.
die ober zeile ist ja vorhanden er drückt auf den Button und shcon
Attribute Name | Attribute Type | Data type | Description | indices
-----------------------------------------------------------------
Attribut

usw eintragen kann
 
Also ich habe das ganze jetzt folgendermasen versucht zu lösen.
aber iwie hab ich da noch nen wurm drinnen o.O

Kann wer helfen?

Code:
<button name="ne" type="button"
 onClick=ONCLICK=neueZeile()'>
 New Entry
 
 </button>
<TABLE id="en01" style="BORDER-RIGHT: white 1px outset; BORDER-TOP: white 1px outset; BORDER-LEFT: white 1px outset; BORDER-BOTTOM: white 1px outset" cellPadding=3 cellspacing=1 border=1 frame='void'  >
 
 <TBODY> 
   <TR>
   <TD colSpan=5>
   <INPUT  type=hidden value='Attribute Information:' name='T90'>
   <U>Default attribute information for Itemtype:</U> </TD>
  </TR>
  <TR>
   <TH align=left>Attribute Name</TH>
   <TH align=left>Attribute Type</TH>
   <TH align=left>Data type</TH>
   <TH align=left>Description</TH>
   <TH align=left>indices</TH>
 
  </TR>
 
<script type=text/javascript>
 
   function neueZeile()
   {
   var referenz = HTMLTableElement.getElementById('en01');
   var newRow   = referenz.insertRow(0);
   var newCell  = newRow.insertCell(0);
 
      } 
   addRow('en01');
 </script>
 </TBODY>
</TABLE><BR>
 
Und was sagt die Fehlerkonsole?

1. Die Funktionsdefinition kommt für gewöhnlich in den <head>, damit sie existiert, wenn die Funktion aufgerufen wird.
2. Ich sehe nirgendwo die Definition der Funktion "addRow", die Du aufrufst.
3. Die Funtkion neueZeile() macht nichts, außer dass sie Variablen deklariert.
4. Der Funktionsaufruf von addRow() passiert nur einmal, nämlich am Ende der Tabelle. Dieser Aufruf ist nicht innerhalb der Funktion neueZeile(), wo Du ihn vielleicht haben wolltest.
 
Aha! Code von https://developer.mozilla.org/en/DOM/table.insertRow kopiert und nicht versucht zu verstehen.

Code:
function addRow (tableRef, cells) {
    var newRow  = tableRef.insertRow(tableRef.rows.length);
   
    for (var i = 0, cell, newCell; cell = cells[i]; i++) {
         newCell = newRow.insertCell(newRow.cells.length);
         newCell.appendChild(cell);
    }
}
addRow(document.getElementById("table1"), [
    document.createTextNode("1"),
    document.createTextNode("2"),
    document.createTextNode("3"),
    document.createTextNode("4"),
    document.createTextNode("5"),
]);
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben