如何仅按前 header 行对 table 进行排序

Question

我知道以前有人问过这个问题，但没有一个解决方案令我满意...

我想将列过滤输入放在 body 和列 headers 之间。我将它们放在 <thead> 内的一个额外的 <tr> 中（许多消息来源说这有效）。

一切正常，除了现在它链接了这些输入而不是 headers 上的排序。你可以看一个例子here。我没有在这个例子中实现列过滤，但你可以看到排序现在链接到输入而不是 <thead>.

中的第一行

$(function() {
   var dataTable = $('#mainTable').DataTable({
       paging: false
   });
});

Answer 1

您可以使用 orderCellsTop 选项设置为 true 以使用 <thead> 中的第一行 <tr> 进行排序。来自手册：

Allows control over whether DataTables should use the top (true) unique cell that is found for a single column, or the bottom (false - default) to attach the default order listener. This is useful when using complex headers.

var dataTable = $('#mainTable').DataTable({
   paging: false,
   orderCellsTop: true
});

请参阅 this JSFiddle 进行演示。

如何仅按前 header 行对 table 进行排序

How to sort table by top header row only

javascript

jquery

datatables