添加新行后拖放不起作用

Question

我正在使用jquery.tablednd.0.7.min.js拖放表行.当我在表中动态添加新行(即使用javascript添加行)时,新行没有拖动n drop.可以拖动表中已存在的其他行.

我认为这个新行没有与jQuery拖放代码同步.

我加入如新排本.

这是jquery dragnDrop文件代码.

在页面加载时,我使用此代码将此功能分配给表

$(document).ready(function() {
    $("#tableId").tableDnD({
        onDragClass : "myDragClass",
        onDrop : function(table, row) {

        },
        onDragStart : function(table, row) {
            console.log("drag start");
        }
    });
});

Answer 1

只是用 $("#tableId").tableDnDUpdate()

来自文档:

Will update all the matching tables, that is it will reapply the mousedown method to the rows (or handle cells). This is useful if you have updated the table rows using Ajax and you want to make the table draggable again. The table maintains the original configuration (so you don't have to specify it again).

Answer 2

您没有显示执行行追加的代码,这是您需要重新绑定tableDnD相关事件的位置,但它看起来像这样:

$(document).ready(function() {
    //on load
    addTableDnD();

    //appending a row
    $(".add-row").click(function() {
        $("<tr />").appendTo("#tableId");
        addTableDnD(); // re-attach events to pick up the new row.
    });
});

function addTableDnD() {
    $("#tableId").tableDnD({
        onDragClass : "myDragClass",
        onDrop : function(table, row) {

        },
        onDragStart : function(table, row) {
            console.log("drag start");
        }
    });
}