在DataTables中克隆選定的行？

我目前能夠刪除選定的行，現在我想複製/克隆選定的行。有時向DataTable添加行可能會很棘手，因爲分頁不會更新，因此需要克隆和追加。在DataTables中克隆選定的行？

jQuery的

var oTable; 

    /* Add a click handler to the rows - this could be used as a callback */ 
    $("#example tbody tr").click(function(e) { 
     if ($(this).hasClass('row_selected')) { 
      $(this).removeClass('row_selected'); 
     } 
     else { 
      oTable.$('tr.row_selected').removeClass('row_selected'); 
      $(this).addClass('row_selected'); 
     } 
    }); 


    /* Add a click handler for the delete row */ 
    $('#delete').click(function() { 
     var anSelected = fnGetSelected(oTable); 
     if (anSelected.length !== 0) { 
      oTable.fnDeleteRow(anSelected[0]); 
     } 
    }); 


    /* Init the table */ 
    oTable = $('#example').dataTable(); 



/* Get the rows which are currently selected */ 
function fnGetSelected(oTableLocal) 
{ 
    return oTableLocal.$('tr.row_selected'); 
}

來源

2013-10-24 triplethreat77

我n階尊重的jQuery分頁數據表的克隆方法應該調用fnAddData功能，

$('#clone').click(function() { 
     var anSelected = fnGetSelected(oTable); 
     console.log(anSelected); 
     var data=[]; 
     $(anSelected).find('td').each(function(){data.push($(this).text());}); 
     oTable.fnAddData(data); 
    });

http://jsfiddle.net/BWCBX/32/

您需要添加點擊監聽器選擇這些新行也是如此。

例如，

$('#clone').click(function() { 
     var anSelected = fnGetSelected(oTable); 
     var data=[]; 
     $(anSelected).find('td').each(function(){data.push($(this).html());}); 
     var row=oTable.fnAddData(data);//returns the index of the row added 
     $(oTable.fnGetNodes(row)).click(function(e) { 
     if ($(this).hasClass('row_selected')) { 
      $(this).removeClass('row_selected'); 
     } 
     else { 
      oTable.$('tr.row_selected').removeClass('row_selected'); 
      $(this).addClass('row_selected'); 
     } 
    }); 
    });

http://jsfiddle.net/BWCBX/33/

來源

2013-10-24 17:21:58 melc

小問題在這裏。我沒有在我的jsfiddle中添加這個（因爲我認爲它不會有所作爲），但每行中的第一個td都有圖標。克隆時（使用上面的代碼）圖標不會與其餘數據一起克隆。 – triplethreat77

明白了，.html（）而不是.text（）。再次感謝。 – triplethreat77

@ triplethreat77如果您需要操作添加的行，即添加一個點擊偵聽器，您可以通過調用fnGetNodes並將param添加到行的索引來獲取它。索引從函數fnAddData返回。我會更新答案以證明這一點。 – melc

我使用jQuery的.clone()實施，請參閱：jsfiddle

$('#clone').click(function(){ 
     var anSelected = fnGetSelected(oTable); 

     anSelected.clone().insertAfter($("table").find("tr").last()); 
     $("table").find("tr").last().removeClass("row_selected"); 
    });

希望這有助於

來源

2013-10-24 16:59:35 marceloogeda

小提琴不是做得比較工作。新添加的行不能被選擇。 – haymansfield

在DataTables中克隆選定的行？

回答

相關問題