[英]Jquery clone table row in html panels
I have a panel and a table inside that panel. 我在面板中有一个面板和一个桌子。 I am adding those panels dynamically and adding rows to table dynamically using jQuery. 我正在动态添加这些面板,并使用jQuery将行动态添加到表中。 Cloning of table rows works just fine but as soon as i add another panel the cloning of table rows doesnt work on second table, please help. 表行的克隆工作很好,但是一旦我添加了另一个面板,表行的克隆在第二个表上就行不通了,请帮忙。
Js code to add panel: js代码添加面板:
$('#addBtn').click(function () {
var total = parseInt($("#click_count").val()) + 1;
$("#click_count").val(total);
var htmlcontent = $(".panel-body:last").html();
var beforecontent = '<div class="panel panel-info po_panel">'
+ '<div class="panel-heading">'
+ '<h6 class="panel-title">'
+ '<a data-toggle="collapse" href="#po' + total + '">Add Panel</a>'
+ '</h6>'
+ '</div>'
+ '<div id="po' + total + '" class="panel-collapse collapse in">'
+ '<div class="panel-body">' + htmlcontent + '</div></div> </div>';
$(beforecontent).insertAfter(".po_panel:last");
});
JS code to clone table row: 克隆表行的JS代码:
$(function() {
$(".btn").click(function(){
var clone = $(this).closest('tr').clone(true);
$("td:first-child", clone).empty();
$("td:first-child", clone).html('<a href="javascript:void(0);" class="remCF">Remove</a>');
clone.insertAfter( $(this).closest('tr'));
});
$("table.table").on('click','.remCF',function(){
$(this).parent().parent().remove();
});
});
Try to use this. 尝试使用这个。
$(function() {
$("body").on('click', '.btn', function(){
var clone = $(this).closest('tr').clone(true);
$("td:first-child", clone).empty();
$("td:first-child", clone).html('<a href="javascript:void(0);" class="remCF">Remove</a>');
clone.insertAfter( $(this).closest('tr'));
});
$("table.table").on('click','.remCF',function(){
$(this).parent().parent().remove();
});
});
Note: you can change $("body")
with container div which hold all the panels. 注意:您可以使用包含所有面板的容器div更改$("body")
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.