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

Tabellenzeile clonen

musclebreast

Mitglied
Hallo,


Code:
<TABLE WIDTH="100%" CELLSPACING="0" CELLPADDING="0" BORDER="0">

<TR height="50px" id="zeile1">
<TD NOWRAP WIDTH="1%">


</TD>
<TD NOWRAP>


<INPUT TITLE="Click" READONLY CLASS="valueEditable" TYPE="TEXT" NAME="value_Path1" VALUE="" SIZE="70">


</TD>
<TD ALIGN="RIGHT" NOWRAP>
<A HREF="javascript:cloneRow( '1')"><IMG SRC="add_row.gif" WIDTH="16" HEIGHT="16" ALT="Duplicate" BORDER="0"></A>
<IMG SRC="/img/spacer.gif" WIDTH="16" HEIGHT="1" ALT="">
</TD>
</TR>
</TABLE>




so würde eine erweiterung um eins aussehen:

Code:
<TABLE WIDTH="100%" CELLSPACING="0" CELLPADDING="0" BORDER="0">

<TR height="50px" id="zeile1">
<TD NOWRAP WIDTH="1%">

<INPUT  TITLE="Click" READONLY CLASS="valueEditable"  TYPE="TEXT" NAME="test1" ID="test1" VALUE="" SIZE="70">
</TD>
<TD NOWRAP>


<INPUT  TITLE="Click" READONLY CLASS="valueEditable"  TYPE="TEXT" NAME="value_Path1" ID="value_Path1" VALUE="" SIZE="70">


</TD>
<TD ALIGN="RIGHT" NOWRAP>
<A  HREF="javascript:cloneRow( '1')"><IMG SRC="add_row.gif"  WIDTH="16" HEIGHT="16" ALT="Duplicate" BORDER="0"></A>
<IMG SRC="/img/spacer.gif" WIDTH="16" HEIGHT="1" ALT="">
</TD>
</TR>


<TR height="50px" id="zeile2">
<TD NOWRAP WIDTH="1%">


</TD>
<TD NOWRAP>


<INPUT  TITLE="Click" READONLY CLASS="valueEditable"  TYPE="TEXT" NAME="value_Path2" ID="value_Path2" VALUE="" SIZE="70">


</TD>
<TD ALIGN="RIGHT" NOWRAP>
<A  HREF="javascript:cloneRow( '2')"><IMG SRC="add_row.gif"  WIDTH="16" HEIGHT="16" ALT="Duplicate" BORDER="0"></A>
<IMG SRC="/img/spacer.gif" WIDTH="16" HEIGHT="1" ALT="">
</TD>
</TR>


</TABLE>


Was zu beachten ist: die Id's der Inputfelder müssen hochgezählt werden um sie eindeutig zu finden. Ausserdem habe ich bei jeder neuen Zeile ein weiteres input feld hinzugefügt. Kann man dies überhaupt bzw. können geclonte zeilen angepasst bzw. verandert werden wöhrend des clones?


Ich habe schon ein wenig im Internet geschaut aber bin mir nicht sich. Welches währe der effizienteste weg dies umzusetzen? Mit welchen methoden? Geht das überhaupt so wie ich es gerne möchte?

LG,

Lara
 
Hallo,

die funktion clone row habe ich schon einmal hingeshrieben, in der will ich den code definieren wenn auf den add button gedrückt wird. Aber welche Techniken würdet ihr empfehlen...speiziell mit meinen Anforderungen (siehe Anfangspost)?

LG,

Lara
 
Naja, bei Tabellenzellen und spacer.gifs schalte ich normaler Weise ab. ;)

Aber sag doch mal, was du eigentlich bezweckst, nur leere Elemente erstellen? Außerdem müssen die <input> Felder vielleicht gar nicht hochgezählt werden.
 
Hi,


haha..ja ich kann dich bei dem design mit dem spacer gif verstehen...das ist nicht ganz von mir, da ich das hatml in einer middlewaaere nach bestimmten richtlinien eingeben muss...ich arbeitre auch viel lieber mit css:)

also um es kurz zu beschreiben..ich habe inputfelder in einer form...über einen button sollen diese belibeig dubliziert werden können.da sie dann per submit der form übertragen werden muss der name schon eindeutig sein, damit ich die variablen wieterverarbeiten kann....deswegen würde ich den namen gerne hochzahlen....wie geht man dies am esten und effizient an?

lg
 
Ich würde auf jeden Fall jQuery nehmen, damit gestaltet sich das Traversieren innerhalb des DOM einfacher.

deswegen würde ich den namen gerne hochzahlen....wie geht man dies am esten und effizient an

Du traversierst zum letzten <input> Element ( Funktion: last() ) und speicherst den Wert des name-Attributs in einer Variablen. Je nachdem ob die Nummer am Anfang oder Ende steht, wird sie mit parseInt() oder substr() extrahiert, um 1 hochgezählt und anschließend zu einem neuen String zusammengebaut, welcher dem anzuhängenden Element (Funktion: append() ) als Name mitgegeben wird.
 
Zurück
Oben