使用另一个table-jQuery中的数据动态地将行添加到表中

Question

我的页面上有两张表，如此处显示的图片。

我想做的是：

1. 选择源表中的行
2. 读取ID字段中的数据，源表中的名称字段，以及单选按钮的值。
3. 将这些数据形成为目标表的行，并将这些行附加到目标表中。

现在我使用两个数组来存储从源表中读取的ID和名称，但是对于如何为目标表形成一行感到困惑。

$('#btnLinkCase').click(function (event) {
var caseID = $('#caseID').text();
var linkedIDArr = []; //array list for selected id
var linkedNameArr = []; //array list for selected name
$('#linkCaseTable tbody tr td:nth-child(2)').each(function (index, el) { //store each paire of <tr> into array
    linkedIDArr.push(el);
});
$('#linkCaseTable tbody tr td:last-child').each(function (index, el) { //store each paire of <tr> into array
    linkedNameArr.push(el);
});
$.each(linkedCaseIDArr, function (index, val) {
    //whats next?
});
});

请参阅所有源代码here

这样做的任何想法？提前致谢

修改： 如果选择多行，则它们将使用单选按钮中的相同值。例如：选择两行并检查“类型1”。在目标表中，它们的关系都是“类型1”。我希望我已经解释过了自己......

Answer 1

尝试：

$('button').click(function (event) {
    $("#sourceTable tr:gt(0)").each(function(){
        var th = $(this);
        console.log("dfg")
        if($(th).find("input[name='link-cbx']").is(":checked")){ //assuming ids are unique remove condition if you do notwant so
            var id = $(th).find("td:eq(1)").text();
            var name = $(th).find("td:eq(7)").text();
            var type = "Type "+$("input[name='linkType']:checked").val();
            if($("#targetTable:contains('"+id+"')").length < 1){            
                $("#targetTable").append("<tr><td>"+id+"</td><td>"+name+"</td><td>"+type+"</td></tr>");
            }
        }
    });
});

Updated fiddle here.