Jquery DataTables 在排序时将顺序更改为 desc

Question

我正在使用 DataTables 来显示一些数据，它效果很好，但我想稍微自定义它，但不确定如何。

我想要做的是，当用户单击列标题对该列进行排序时，我希望它最初按降序而不是升序排序。有什么办法可以做到这一点吗？

Answer 1

看看这个： DataTables 排序方向控制示例

您可以执行以下操作：

$(document).ready(function() {
    $('#example').dataTable( {
        "aoColumns": [
            { "asSorting": [ "desc", "asc" ] }, //first sort desc, then asc
        ]
    } );
} );

Answer 2

当前版本的 DataTables (1.10) 提供了以下方法来切换此默认排序顺序，其中使用 columnDefs 下的属性 orderSequence （或 columns 但更少）灵活的）。

以下是有关 orderSequence 的文档。

"columnDefs": [
    { "orderSequence": [ "desc", "asc"], "targets": [ 1 ] },
]

正如它还提到的，您可以强制列仅在单击时按 DESC 或 ASC 进行排序，您的界面可能会从中受益。

就我而言，我需要在初始单击时对不确定数量的列进行降序排序，因此我决定切换示例以定位列标题的 class 名称，而不是将每列显式定义为 < code>"targets":[1],"targets":[2],...[n] 或以编程方式构建我关心的列索引数组。

您可以通过多种方式来定位列根据此处。

最终结果是一个像这样的表定义：

<table><thead><tr>
    <th class='descendFirst'>DESCend when first clicked</th>
    <th>a normally sorted ASC->DESC->... column</th>
    ...
</tr></thead></table>

数据表的授权如下：

$("#table").dataTable({
    "columnDefs": [
        {"orderSequence": ["desc","asc"], "targets":"descendFirst" },
    ]
});

瞧！首先，对带有“descendFirst”类（任意选择的描述性类名）标记的 的所有列单击降序排序。

Answer 3

为了回应最后对空白进行排序，这就是我想到的--
（我只是讨厌首先对空白进行排序！！）

包含这些自定义排序函数

// custom sort functions
jQuery.fn.dataTableExt.oSort['text-blankslast-asc'] = function (x, y) {  
   x = (x == "") ? String.fromCharCode(255) : x;  
   y = (y == "") ? String.fromCharCode(255) : y;  
   return ((x < y) ? -1 : ((x > y) ? 1 : 0));  
};  

jQuery.fn.dataTableExt.oSort['text-blankslast-desc'] = function (x, y) {  
   x = (x == "") ? String.fromCharCode(0) : x;  
   y = (y == "") ? String.fromCharCode(0) : y;  
   return ((x < y) ? 1 : ((x > y) ? -1 : 0));  
};  

将排序标签应用到适当的列

// init example  
$('#table2').dataTable({  
   "bJQueryUI": true,  
   "aoColumns": [  
      null,  
      { "sType": "text-blankslast" },  
      { "sType": "text-blankslast" },  
      { "sType": "text-blankslast" },  
      null  
   ]  
});  

Answer 4

如果像戴夫和我这样的其他人正在寻找一种在所有列上设置排序顺序的方法，那么以下内容可能适合您。为了更改所有列的排序顺序，我设置了一个循环来在表实例化后更改设置：

$(document).ready(function() {
    var example_table = $('#example').dataTable();
    $.each(example_table.dataTableSettings[0].aoColumns, function(key, column) {
        column.asSorting = [ "desc", "asc" ];
    } );
} );

希望有帮助。在 jQuery 1.11.0 和 DataTables 1.10.0 上测试

Answer 5

下面的代码是先设置默认排序顺序 desc，然后对所有列设置升序。

aoColumnDefs: [{
    orderSequence: ["desc", "asc"],
    aTargets: ['_all']
}],

Answer 6

最后获得空白的唯一方法是进行一些修改（因为排序工作正常）。

不要从服务器返回空白值，而是返回类似以下内容的内容：“[空白]”

我还没有测试过它，但我很确定方括号会出现在字母数字代码之后。方括号传统上也象征着尚未完成或确认的事情。

Answer 7

这对我有用：

       settings = {
           aoColumnDefs: [
            {
                orderSequence: ["desc", "asc"],
                aTargets: ['_all']
            }
        ]};

        $('.dataTable').DataTable(settings);