JQuery DataTables 交换行

Question

我创建了一个函数来交换 table 中的行，但它似乎无法正常工作。行的数据似乎与数组中的数据不匹配。任何人都可以帮助指出我的代码中的错误，或者我可能如何滥用某些 DataTable 函数？

function swapDataTableRows(selector, row1Index, row2Index)
{
    var datatable = selector.DataTable();
    var rows = datatable.rows().data();
    var row1Data = datatable.row(row1Index).data();
    var row2Data = datatable.row(row2Index).data();

    datatable.row(row1Index).data(row2Data);
    datatable.row(row2Index).data(row1Data);
}

swapDataTableRows(table, 2, 3) - 它将交换第 1 行和第 2 行。如果我将 1 添加到索引，它就会超出范围。

Answer 1

我不确定是否理解你的问题...

我尝试创建一个简单的演示来理解：

http://jsfiddle.net/q0zb1rkc/

... 在您的函数中，您永远不会 draw table 具有新的（已编辑）数据：

我更改了您脚本的这两行：

datatable.row(row1Index).data(row2Data);
datatable.row(row2Index).data(row1Data);

然后我添加 .draw():

datatable.row(row1Index).data(row2Data);
datatable.row(row2Index).data(row1Data);

宽度.draw()也DOM改变，ROW1和ROW2交换。

Answer 2

来自Frogmouth的回答，

`http://jsfiddle.net/bobxdr7c/`

我添加了一些更改。

由于在实例化 Datatable 时将排序选项设置为默认值，每当您尝试交换他们的数据并重新绘制时，它看起来都不是您所期望的。

要解决此问题，

检查您的 'ordering' 选项集 'false'。
不要调用 draw() 函数两次。在最后一个语句调用一次就足够了。

P.S。嗯，看来我不能直接在 post 中创建一个 jsfiddle link。 :(

Answer 3

如果这不是第一次行切换，您很可能使用了错误的行索引。 DOM 中显示的索引不一定是行在 api 中的索引。您是否尝试过使用特定选择器（例如它们的 id）来处理行？例如：datatable.row("#row1id")

此外，要在 DOM 中更新更改，您需要在所有数据切换完成后调用 datatable.draw()。

JQuery DataTables 交换行

JQuery DataTables Swapping Rows

javascript

jquery

datatables