jQuery DataTables：如何按特定列排序？

这是页面：

http://csuvscu.com/

我需要按日期列排序，现在它需要阅读11月6日，11月5日和最后10月7日。

我该怎么做呢？

您当前的代码： 

$('table').dataTable({ // display everything "iDisplayLength": -1 });

你能做什么： 

 oTable = $('table').dataTable({ // display everything "iDisplayLength": -1 }); oTable.fnSort( [ [0,'desc'] ] ); // Sort by first column descending

但正如下面的评论所指出的，这可能是一种更清洁的方法： 

 $('table').dataTable({ // display everything "iDisplayLength": -1, "aaSorting": [[ 0, "desc" ]] // Sort by first column descending });

DataTables使用字母顺序作为默认排序方法。 这实际上就是这里发生的事情。

有两种解决方案：

  • 定义自己的日期排序方法
  • 使用包含Unix时间戳中的日期的隐藏列对表进行排序（自1970年1月1日起经过的秒数）。

如果您希望用户能够自己对列进行排序，则可以使用第一个解决方案。

—————第一个解决方案：

我们需要告诉DataTable插件如何处理我们的列。 您需要使用“aoColumns”属性： 

 $('table').dataTable({ // display everything "iDisplayLength": -1, "aoColumns":[ {"sType": "shaheenery-date"}, {"bSortable": true}, {"bSortable": true}, {"bSortable": true}, {"bSortable": true} ] });

然后定义“shaheenery-date-asc”和“shaheenery-date-desc”排序方法。 您还需要一个以数字格式翻译日期的函数“getDate”： 

 function getDate(a){ // This is an example: var a = "Sunday November 6, 2011"; // your code =) // ... // ... // You should output the result as YYYYMMDD // With : // - YYYY : Year // - MM : Month // - DD : Day // // Here the result would be: var x = 20111106 return x; } jQuery.fn.dataTableExt.oSort['shaheenery-date-asc'] = function(a, b) { var x = getDate(a); var y = getDate(b); var z = ((x < y) ? -1 : ((x > y) ? 1 : 0)); return z; }; jQuery.fn.dataTableExt.oSort['shaheenery-date-desc'] = function(a, b) { var x = getDate(a); var y = getDate(b); var z = ((x < y) ? 1 : ((x > y) ? -1 : 0)); return z; };

—————第二个解决方案：

我们也将使用“aoColumns”属性。 这次我们告诉DataTable隐藏包含Unix时间戳中日期的最后一列。 我们还需要将此列定义为使用“aaSorting”进行排序的默认列： 

 $('table').dataTable({ // display everything "iDisplayLength": -1, "aaSorting": [[ 5, "desc" ]], "aoColumns":[ {"bSortable": false}, {"bSortable": true}, {"bSortable": true}, {"bSortable": true}, {"bVisible": false} ] }); 
 oTable = $('#DataTables_Table_0').dataTable({ //table id -->DataTables_Table_0 iVote: -1, //field name "bRetrieve":true }); oTable.fnSort( [ [1,'desc'] ] ); // Sort by second column descending 
  $（'＃id'）。dataTable（{
      “bSort”：是的，
      “aoColumnDefs”：[{ 
          'bSortable'：false， 
          'aTargets'：[1]}
       ]
 }）;

现有答案使用遗留DataTables语法。 版本1.10+应使用以下语法： 

 $('table').dataTable({ "pageLength": -1, //display all records "order": [[ 0, "desc" ]] // Sort by first column descending });

参考：

  • 排序
  • 页面长度

使用最新版本的数据表，您可以按列索引进行排序 

 var data_table = $('#data-table').DataTable(); data_table.order( [7,'desc'] ).draw();

希望这可以帮助。

$（’＃id’）。dataTable（{

“”aaSorting“：[[”0“，”<“desc”或asc>“]]

}）;

Interesting Posts