text zusätzlich ausgeben

[pete]

Hi, ich habe ein Formular, in dem 3 zeilen einer tabelle je mit textfeldern gefüllt sind. mit einem klick auf einen definierten link soll nun eine weitere zeile angefügt werden.

mit document.write schreibts aber alles in eine neue, leere seite

was muss ich tun?

vielen dank

[Gunnar Bittersmann]

Hi pete,

Hi, ich habe ein Formular, in dem 3 zeilen einer tabelle je mit textfeldern gefüllt sind. mit einem klick auf einen definierten link soll nun eine weitere zeile angefügt werden.

(a) Die Zeile befindet sich bereits im HTML-Code, ist mit CSS auf display:none gesetzt.* Ändere diese Eigenschaft mit JavaScript.

oder

(b) Füge in den Elementenbaum mit DOM die Tabellenzeile und die Zellen ein. Bedenke, dass in HTML tr kein Kind von table ist.

Gruß,
Gunnar

* Bei ausgeschaltetem CSS oder eigenem Stylesheet ist die Zeile natürlcih dann sichtbar.

[pete]

Hi pete,

(a) Die Zeile befindet sich bereits im HTML-Code, ist mit CSS auf display:none gesetzt.* Ändere diese Eigenschaft mit JavaScript.

das wäre eine möglichkeit, aber es sollen ja beliebig viele neue zeilen angezeigt werden können

(b) Füge in den Elementenbaum mit DOM die Tabellenzeile und die Zellen ein. Bedenke, dass in HTML tr kein Kind von table ist.

kannst du mir ein beispiel oder den link zur hilfe geben?

danke übrigens für die rasche antwort

gruss pete

[pete]

var Zeile = 0;
function ZeileEinfuegen () {
  if (Zeile == 0)
    document.getElementById("list").deleteRow(0);
  var TR = document.getElementById("list").insertRow(Zeile);
  Zeile += 1;
  var TD1 = document.createElement("td");
  var TD1text =  document.createTextNode("<input type='text' class='loginfield'>");
  TD1.appendChild(TD1text);

var TD2 = document.createElement("td");
  var TD2text = document.createTextNode("<input type='text' class='loginfield'>");
  TD2.appendChild(TD2text);

var TD3 = document.createElement("td");
  var TD3text =  document.createTextNode("<input type='text' class='loginfield'>");
   TD3.appendChild(TD3text);

TR.appendChild(TD1);
  TR.appendChild(TD2);
  TR.appendChild(TD3);
}

hab ich jetzt mal gemacht, aber es fügt kein input-field ein, sondern nur den text, wie muss ich das machen?

[Gernot Back]

Hallo pete,

var TD3 = document.createElement("td");
  var TD3text =  document.createTextNode("<input type='text' class='loginfield'>");
   TD3.appendChild(TD3text);

hab ich jetzt mal gemacht, aber es fügt kein input-field ein, sondern nur den text, wie muss ich das machen?

Wundert dich das? INPUT ist ja auch seinerseits ein Element und kein Textknoten.

Gruß Gernot

[pete]

Hallo pete,

Wundert dich das? INPUT ist ja auch seinerseits ein Element und kein Textknoten.

joa das ist mir schon klar. aber wie muss ich den dieses element erzeugen und einbinden? bin leider nich gerade der javascript-hirsch =(

Gruß Gernot

[Gernot Back]

Hallo pete,

joa das ist mir schon klar. aber wie muss ich den dieses element erzeugen und einbinden? bin leider nich gerade der javascript-hirsch =(

Das TD-Element, das du als Elternelement für dein INPUT-Element vorgesehen hast, hast du doch auch erzeugt, das kannst du doch offensichtlich.

Gruß Gernot

[pete]

um ehrlich zusein, das hatte ich geklaut^^

ich habs jetzt mal versucht:

var Zeile = 0;
function ZeileEinfuegen () {
  if (Zeile == 0)
    document.getElementById("list").deleteRow(0);
  var TR = document.getElementById("list").insertRow(Zeile);
  Zeile += 1;
  var TD1 = document.createElement("td");

var input = document.createElement("input");
  input.setAttribute("type","text");
  input.setAttribute("name","vorname");

TD1.appendChild(input);

var TD2 = document.createElement("td");

var input = document.createElement("input");
  input.setAttribute("type","text");
  input.setAttribute("name","vorname");
  TD2.appendChild(input);

var TD3 = document.createElement("td");

var input = document.createElement("input");
  input.setAttribute("type","text");
  input.setAttribute("name","vorname");
   TD3.appendChild(input);

TR.appendChild(TD1);
  TR.appendChild(TD2);
  TR.appendChild(TD3);
}

jetzt musss ich nur noch namen ändern, den td's ein stylesheet zuordnen und die align anpassen

danke

[pete]

laut http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#input kann man dass class-attribut nicht ändern. wie kann ich denn dann dem erzeugten element eine css klasse zuweisen?

[Gernot Back]

Hallo pete,

laut http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#input kann man dass class-attribut nicht ändern. wie kann ich denn dann dem erzeugten element eine css klasse zuweisen?

mit className

Gruß Gernot

[Ashura]

Hallo Gernot.

wie kann ich denn dann dem erzeugten element eine css klasse zuweisen?

mit className

Ich glaube eher, dass er das Attribut „class“ zuweisen möchte.
Dafür braucht er setAttribute.

Einen schönen Mittwoch noch.

Gruß, Ashura

[pete]

Hallo Gernot.»»
Ich glaube eher, dass er das Attribut „class“ zuweisen möchte.
Dafür braucht er setAttribute.

Einen schönen Mittwoch noch.

Gruß, Ashura

genau das möchte ich machen, aber mit setAttribute klappt das bei mir irgendwie nicht. die anderen attributte gehen, aber bei "class" passiert nix

[Gernot Back]

Hallo pete,

setAttribute.

genau das möchte ich machen, aber mit setAttribute klappt das bei mir irgendwie nicht. die anderen attributte gehen, aber bei "class" passiert nix

  
input.className='deineKlasse';  

und fertig!

Gruß Gernot

[pete]

Hallo pete,

setAttribute.

genau das möchte ich machen, aber mit setAttribute klappt das bei mir irgendwie nicht. die anderen attributte gehen, aber bei "class" passiert nix

input.className='deineKlasse';

> und fertig!  
>   
> Gruß Gernot  
  
JAAAAAAAAAAAAAAAAAAAa =)  
  
vielen dank, ich bin ja schon schwer von begriff^^  
muss am wetter liegen ;)  
  
thx a lot  
greez

[Gernot Back]

Hallo Ashura,

wie kann ich denn dann dem erzeugten element eine css klasse zuweisen?

mit className

Ich glaube eher, dass er das Attribut „class“ zuweisen möchte.
Dafür braucht er setAttribute.

Das ist wahrscheinlich "gehupft wie gesprungen"!

Gruß Gernot