HTML Tabellenzeile klonen / neu erstellen mit Javascript

Aktuelle Programmier- und Auszeichnungssprachen HTML / CSS / JavaScript
1

Hallo,

ich möchte folgende Tabellenzeile


<table id="tmplOpenTime">
	<tbody>
		<tr>
			<td> <input type="hidden" name="ao.days" value="Montag, Dienstag"/> Montag, Dienstag </td>
			<td> <input type="hidden" name="ao.time" value="08:00 bis 13:00"/> 14:00 bis 19:00 </td>
			<td> <input type="hidden" name="ao.info" value="Test Info 2"/> Test Info 2 </td>
			<td> <input type="hidden" name="ao.comment" value="Test Kommentar 2"/> Test Kommentar 2 </td>
			<td>
				<button type="button" id="sort3" class="MyButton iconOnly deletetr">
						<span class="icon delete"></span>
				</button>
			</td>
		</tr>
	</tbody>
</table>

mit diesen Javascript Code:
[Javascript]
$(".newOpenTime").click(function() {
$("#openTime").find(‘tbody’).append($(’#tmplOpenTime’).find(‘tr’).clone(true, true));
});
[/Javascript]
klonen. Das klappt auch soweit. Jetzt müsste ich nur noch die Werte wie zum Bsp. “Montag, Dienstag” ändern können. Hat jemand eine Idee wie das klappen könnte?

Danke

2

Speicher dir den Klon als Variable. Dann kannst du darauf arbeiten:


<script type="text/javascript">
    $(document).ready(function() {
        $('#addEntry').click(function() {
            var entry = $('#master').clone(true, true);
            var date = new Date();
            $('.time', entry).text(date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds());
            $('.msg', entry).text("Neuer Beitrag");

            entry.appendTo($('#demo'));
        });
    });
</script>
<br />
<table id="demo">
    <tr id="master">
        <td class="time">Zeit</td>
        <td class="msg">Message</td>
    </tr>
</table>
<input type="button" value="add" id="addEntry" />
3

Ahh danke.

War ein super Tipp und sehr nach dran an dem was ich wirklich brauchte.
Das was ich geänder habe ist statt der jQuery Methode .text() .html() zu verwenden um da auch noch weitere HTML Elemente in die Tabelle zu bekommen.