如何在DataTables中设置指定列排序并保留表头排序图标？

太懂这种糟心的情况了——直接调用.order(2)确实能让数据按指定列排好序，但表头的上下箭头直接消失了，完全没法一眼看出当前是按哪列排的！

问题根源在于：.order()方法只是在底层设置了排序规则，但没有触发DataTables内置的UI更新流程。而我们手动点击表头的时候，DataTables会同时处理排序逻辑和表头的样式标记（比如给对应<th>加上sorting_asc或sorting_desc类来显示箭头）。

给你两个靠谱的解决方案，按需选就行：

方案1：规范调用.order()并明确排序方向 #

把原来的.order(2)改成带排序方向的完整写法，这样DataTables会自动同步UI状态：

var addedRow = dataTable.row.add([a, b, moment(someDate).format("DD/MM/YYYY hh:mm:ss"), d]);
// 明确指定第3列（索引为2）按升序排序，需要降序就把'asc'改成'desc'
dataTable.order([[2, 'asc']]).draw();

执行这段代码后，数据会按日期列排序，表头的箭头图标也会和手动点击表头时完全一致。

方案2：模拟用户点击表头的行为 #

如果你想100%复刻手动点击表头的所有效果（包括可能绑定的其他回调逻辑、排序方向切换等），可以直接触发表头元素的点击事件：

var addedRow = dataTable.row.add([a, b, moment(someDate).format("DD/MM/YYYY hh:mm:ss"), d]);
// 获取第3列的表头DOM元素，触发点击事件
dataTable.column(2).header().click();

这个方法相当于“模拟用户手动点击”，所有UI状态和业务逻辑都会和手动操作完全同步，连如果之前已经排过序，这次会切换方向的逻辑都能保留。

两种方法都能完美解决你的问题，方案1更直接高效，方案2更贴合真实交互场景~

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