DataTables开启RowReorder拖拽重排后其余列值匹配错误问题求解

问题根因 #

列值错乱由两个配置错误导致：

1. 全局配置中设置了"ordering": false，而RowReorder插件完全依赖DataTables的原生排序能力实现整行数据的同步移动，全局禁用排序后插件仅能更新首列内容，其余列的数据映射会出现错乱。
2. 未给rowReorder指定拖拽触发选择器，容易触发非预期的拖拽行为，进一步增加数据同步异常概率。

解决方案 #

修正后的JS初始化代码如下：

var tablePositionen = $('#tablePositionen').DataTable({
        columnDefs: [
            { targets: [0], orderable: true, className: 'reorder' },
            { targets: '_all', orderable: false }
        ],
        // 移除原有的ordering: false配置，保留默认开启排序
        "paging": false,
        rowReorder: {
            selector: 'td.reorder' // 指定仅第一列可触发拖拽
        },
        "lengthMenu": [[10], [10]],
        "language": {
            "url": "https:////cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/German.json"
        }
    });

如果后续需要获取拖拽后的最新行顺序，可监听row-reorder事件获取变更后的行数据索引。

内容的提问来源于stack exchange，提问作者Trombone0904