Question

我正在尝试将jQuery DataTables（http://datatables.net/）与Row Ordering插件（http://code.google.com/p/jquery-datatables-row-reordering/wiki/Index）一起使用。最初，行的重新排序看起来像是有效的，但是有一个javascript错误＆＃34;错误：语法错误，无法识别的表达式：＃＆＃34;。所以我实现了这里概述的解决方案：http://datatables.net/forums/discussion/19011/drag-and-drop-row-reordering-issue给tr元素提供唯一ID。现在没有javascript错误。但是，行重新排序现在根本不起作用。我拖了一行，但当我放下它时，表只是恢复到之前的状态。

以下是使用javascript：http://pastebin.com/2P9hJ7n2

的完整HTML文件

还有其他人遇到过这个问题吗？如果是这样，你是如何解决它的？

我尝试在重新排序javascript的行中挖掘，看起来问题是抓住行的当前和先前位置：

// fyi: properties.iIndexColumn is 0
var iCurrentPosition = oTable.fnGetData(tr, properties.iIndexColumn);
//...
oTable.fnGetData(trPrevious[0], properties.iIndexColumn);

无论它期望从fnGetData获得什么，都发生了变化。我已经迭代了oTable.fnGetData（tr，i）返回的几个i的值，它似乎是行的单元格。

我的猜测是自从这个插件编写以来DataTables的实现已经改变了。我只是想知道它是否可以轻易解决这个问题。

Answer 1

为防止拖放后返回，请使用“ update：false”属性。

var table = $('#categories').DataTable( {

    "ajax": "someurl",

    "rowReorder": {
        selector: 'tr',
        update: false,
    },

});

Answer 2

正如您在wiki-link所提供的那样，

每个TR元素必须具有id属性。

表中的一列应该是索引列。此列将用于确定表中行的位置。默认情况下   这是表格中的第一列。你可以看到表的结构   在实例页面上。

“无法识别的表达式：＃”与第一个需求相关;您无法移动行与第二个相关。您只是缺少索引列。正如您已找到缺少的<tr> #id，您可以通过编程方式轻松创建该列：

$("#mySuperTable thead tr").prepend('<th>#</td>');    
var count = $("#mySuperTable tbody tr").length-1;
$("#mySuperTable tbody tr").each(function(i, tr) {
    $(tr).attr('id', 'id'+i);
    $(tr).prepend('<td>'+parseInt(i+1)+'</td>');    
    if (i==count) {
       $("#mySuperTable").dataTable({
           //...initialization options
       }).rowReordering();
    }     
});

现在RowReordering可以与你的表一起使用 - ＆gt;的 http://jsfiddle.net/gy8s3hoa/

请注意，上面的演示正在运行dataTables 1.10.x.该问题与dataTables版本或dataTables内部的一些更改无关，它只是关于如何创建RowReordering插件。如果你问我，它不是很优雅。该插件应该自己创建id和它需要的索引列（并使其隐藏）。

jquery DataTables行重新排序：订单在删除后恢复

2 个答案: