数据表中列的自定义（组）排序

Question

我正在尝试了解Datatables 中的自定义排序机制。我要做的是根据列的值和其他列的值（包含一个组）对列进行排序，以获得按组排序。

为此，我遇到了排序插件：https://datatables.net/plug-ins/sorting/

作为一个例子（可能是另一个），我查看了“anti-the”插件。为了激活它，我添加了：

targets = "_all", type = "anti-the"

到columnDefs

使用过

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
    "anti-the-pre": function ( a ) {
        console.log("pre");
        return a.replace(/^the /i, "");
    },

    "anti-the-asc": function ( a, b ) {
        console.log("asc");
        return ((a < b) ? -1 : ((a > b) ? 1 : 0));
    },

    "anti-the-desc": function ( a, b ) {
        console.log("desc");
        return ((a < b) ? 1 : ((a > b) ? -1 : 0));
    }
} );

计划是调整这三个函数以获得所需的分组排序。

1. 有趣的是，每次单击表格标题（并且重新使用表格）时，控制台都会打印“pre”。我希望“asc”和“desc”也会被打印（以交替顺序），但什么也没打印，为什么？

2. 这是获得所需分组排序结果的正确方法，还是我需要定义自己的“orderDataType”才能达到此目的？

编辑：

只是为了让事情更清楚一点： 假设我有一个表格，其中包含有关“部门”和“楼层”的信息/列。在对“楼层”进行排序时，我希望对每个部门的楼层进行排序

排序前：

|部门|楼层|

|IT|2|

|IT|1|

|销售额|1|

|销售额|2|

点击标题后（“地板”-> asc）

|IT|1|

|IT|2|

|销售额|1|

|销售额|2|

再次点击（描述）

|IT|2|

|IT|1|

|销售额|2|

|销售额|1|

在我拥有的数据中，组之间没有混合（这里：部门）->同一部门的行将彼此相邻

Answer 1

当您尝试对数据进行分组排序时，我建议您结合 HTML5 data-* 属性使用数据表“正交数据”

您可以在此处阅读 (Datatables Website - Orthagonal Data - HTML5)，使用自定义属性 data-order 应该是您的首选武器。

例如：

您想将department 和floor 分组，但只向用户显示department。此示例应向您显示所需的输出

（姓氏单元格中的楼层号是可视化正确排序的帮助器，可以删除）

<table id="myTestTable" class="display">
    <thead>
        <tr>
            <th>Department</th><th>Surname</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td data-order="it 1">IT</td> <td>Daniel (1)</td>
        </tr>
        <tr>
            <td data-order="sales 2">sales</td> <td>Sue (2)</td>
        </tr>
        <tr>
            <td data-order="it 1">IT</td> <td>John (1)</td>
        </tr>
        <tr>
            <td data-order="it 2">IT</td> <td>Mr. Miyagi (2)</td>
        </tr>
        <tr>
            <td data-order="sales 2">sales</td> <td>Mel (2)</td>
        </tr>
        <tr>
            <td data-order="sales 1">sales</td> <td>Marc (1)</td>
        </tr>
    </tbody>
</table>
<script>
    $('#myTestTable').dataTable();
</script>

编辑：

第一个示例中的排序对于 10 层及以上的楼层是错误的。它将是 1、10、2、3、4 等等，因为数据表会对字符串进行严格排序。

为了解决这个问题，datatables 网站上有一个名为 natural sorting 的排序插件。包含此代码并将 { columnDefs: [ { type: 'natural' , targets: 0 } ] } 添加到 tabledefinition 将修复排序为更多 human 方式。