Question

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

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

Answer 1

看看这个：DataTables sorting direction control example

您可以执行以下操作：

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

Answer 2

DataTables（1.10）的当前版本提供了以下方式，使用orderSequence下的属性columnDefs切换此默认排序顺序（或columns，但不太灵活）。

这是orderSequence上的文档。

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

正如它所提到的那样，当您点击作为DESC或ASC时，您可以强制列仅排序，您的界面可能会从中受益。

在我的情况下，我需要在初始点击时将列降序排列为不确定数量的列，因此我决定将示例切换为定位列标题的class名称，而不是明确定义每列作为"targets":[1],"targets":[2],...[n]或以编程方式构建我关心的列索引数组。

您可以多种方式定位列according to here。

最终结果是表定义如下：

<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" },
    ]
});

瞧！首先点击所有列上的降序排序，其中<th>标记为＆＃39; descendFirst＆＃39; （任意选择的描述性类名）。

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

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

$(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

让你的空白最后一个的唯一方法是有点黑客（因为排序工作正常）。

不是从服务器返回空白值，而是返回类似：“[Blank]”

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

Answer 6

这对我有用：

com.xxx.myApp.watchkitapp.watchkitextension

Jquery DataTables在排序时将订单更改为desc

6 个答案: