TableDnD onDrop事件未觸發

我確定這是非常簡單的事情，通常是這樣。TableDnD onDrop事件未觸發

$('#sort-table').tableDnD({ 
    onDragClass: "dnd_drag", 
    onDragStart: function(table, row) { 
     console.log("start drag"); 
    }, 
    onDrop: function(table, row) { 
     console.log($.tableDnD.serialize()); 
    }, 
    dragHandle: ".dragHandle" 
});

我有上面的代碼在tableDnD，jQuery表排序插件的行動。這是它們提供的示例中的確切代碼，但是當我在表中刪除項目時，它不會正確觸發onDrop事件。我在控制檯中沒有得到任何迴應。該表初始化，並拖動手柄正常工作，所以我至少知道部分代碼是正確的。我唯一不能工作的是onDrop命令。

更新：
我更新了上面的代碼中添加一個onDragStart和onDragClass，這兩者完美的工作，它只是onDrop功能失敗。

這是我一般表格佈局：

<table id="sort-table"> 
    <tbody class="sort-items"> 
     <tr class="1"> 
      <td class="dragHandle"></td> 
      ... 
     </tr> 
     ... 
    </tbody> 
</table>

來源

2012-08-01 Beau

那麼我的第一個問題，我得到了答案。希望這有助於未來的人。

問題出在我的表格行的實際ID上。我實際上使用了uuid，這意味着我的行實際上有一個類似於「26b5122e-bbb8-11e1-9c53-d4856404b576」的ID。很明顯，TableDnD做了一些序列化數據，這些數據打破了我的ID分開，只抓住最後一組數字，這對大多數項目是相同的。

從已導致該問題的jquery.tablednd.js文件中的行是這樣的（左右線380）：

... 
var rowId = rows[i].id; 
if (rowId && table.tableDnDConfig && table.tableDnDConfig.serializeRegexp) { 
    rowId = rowId.match(table.tableDnDConfig.serializeRegexp)[0]; 
} 

result += tableId + '[]=' + rowId; 
...

我只是去掉了串行，因爲我知道我不會需要它爲我的行ID。然後我沿着自己傳遞了行ID。這是結果。

... 
var rowId = rows[i].id; 

result += tableId + '[]=' + rows[i].id; 
...

所以如果你使用破折號在你的行ID，請務必將其更改爲正確作出onDrop火災。

來源

2012-08-02 14:31:44 Beau

您必須定義tr [id]屬性才能使onDrop正常工作。這是因爲onDrop僅在行順序更改時觸發。但是，沒有指定tr [id]屬性，tableDnD.serialize（）會認爲沒有任何重新排序。（Bug肯定）

來源

2013-01-08 06:04:23 crab

當我添加了ID爲TR，onDrop活動正式開始工作 – Memonic 2015-11-26 12:57:56

快速修復。

如果你想讓onDrop在沒有row.id的情況下工作，你可以編輯插件。

替換此（線255，其中功能開始 - currentOrder）

 var rows = this.currentTable.rows; 
     return $.map(rows, function (val) { 
      return ($(val).data('level') + val.id).replace(/\s/g, ''); 
     }).join('');

有了這個

return $(this.dragObject).index();

來源

2015-03-03 09:18:18

一般來說是不在未來更新的情況下修改這樣的第三方插件是個好主意。如果我按照你的建議改變了它，我必須創建並維護我自己的tableDnD插件的分支，或者我必須在插件應用升級時再次更新插件。這使未來改進的過程變得複雜化。 – Beau 2015-03-03 14:58:44

這是真的你在說什麼，這就是爲什麼注意到「快速修復」，你必須小心。我有計劃在github上做PR，但需要一些時間來創建正常的解決方案，而不僅僅是「黑客」。 – 2015-03-03 21:04:38

更好的解決方法是給每一行一個id。沒有傷害。 – Vincent 2015-06-27 20:47:58

TableDnD onDrop事件未觸發

回答

相關問題