jQuery DataTables:如何按特定列排序?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7878098/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery DataTables: how to sort by specific column?
提问by Snow_Mac
Here's the page:
这是页面:
I need to sort by the Date Column, right now it needs to read Nov 6, Nov 5 and lastly Oct 7.
我需要按日期列排序,现在它需要读取 11 月 6 日、11 月 5 日和最后 10 月 7 日。
How do I do this?
我该怎么做呢?
回答by shaheenery
Your Current Code:
您当前的代码:
$('table').dataTable({
// display everything
"iDisplayLength": -1
});
What you could do:
你可以做什么:
oTable = $('table').dataTable({
// display everything
"iDisplayLength": -1
});
oTable.fnSort( [ [0,'desc'] ] ); // Sort by first column descending
But as pointed out in the comment below, this may be a cleaner method:
但正如下面评论中所指出的,这可能是一种更简洁的方法:
$('table').dataTable({
// display everything
"iDisplayLength": -1,
"aaSorting": [[ 0, "desc" ]] // Sort by first column descending
});
回答by paic_citron
DataTables uses Alphabetical order as the default sorting method. This is actually what happens here.
DataTables 使用字母顺序作为默认排序方法。这实际上就是这里发生的事情。
There are two solution:
有两种解决方法:
- Define your own date sorting method
- Sort the table using an hidden column containing the date in Unix Timestamp (seconds elapsed since 1st January 1970).
- 定义您自己的日期排序方法
- 使用包含 Unix 时间戳(自 1970 年 1 月 1 日以来经过的秒数)中的日期的隐藏列对表进行排序。
If you want your users to be able to sort the column by themselves you might use the first solution.
如果您希望您的用户能够自己对列进行排序,您可以使用第一种解决方案。
--------------- First Solution:
--------------- 第一个解决方案:
We need to tell the DataTable plugin what to do with our columns. You'll need to use the "aoColumns" property:
我们需要告诉 DataTable 插件如何处理我们的列。您需要使用“aoColumns”属性:
$('table').dataTable({
// display everything
"iDisplayLength": -1,
"aoColumns":[
{"sType": "shaheenery-date"},
{"bSortable": true},
{"bSortable": true},
{"bSortable": true},
{"bSortable": true}
]
});
Then define the "shaheenery-date-asc" and "shaheenery-date-desc" sorting method. You also need a function "getDate" that translate the date in numeric format:
然后定义“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;
};
--------------- Second Solution:
---------------第二种解决方案:
We are going to use the "aoColumns" property as well. This time we tell DataTable to hide the last column which will contains the date in Unix Timestamp. We also need to define this column as the default one for sorting with "aaSorting":
我们还将使用“aoColumns”属性。这次我们告诉 DataTable 隐藏最后一列,该列将包含 Unix 时间戳中的日期。我们还需要将此列定义为使用“aaSorting”进行排序的默认列:
$('table').dataTable({
// display everything
"iDisplayLength": -1,
"aaSorting": [[ 5, "desc" ]],
"aoColumns":[
{"bSortable": false},
{"bSortable": true},
{"bSortable": true},
{"bSortable": true},
{"bVisible": false}
]
});
回答by Divyesh
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
回答by Andrés Rosales Campos
$('#id').dataTable( { "bSort": true, "aoColumnDefs": [{ 'bSortable': false, 'aTargets': [ 1 ] } ] });
回答by devlin carnate
The existing answers are using legacy DataTables syntax. Versions 1.10+ should use the following syntax:
现有答案使用旧版 DataTables 语法。版本 1.10+ 应使用以下语法:
$('table').dataTable({
"pageLength": -1, //display all records
"order": [[ 0, "desc" ]] // Sort by first column descending
});
Reference:
参考:
回答by Darren Hall
With the latest version of Data Tables you can sort by column index
使用最新版本的数据表,您可以按列索引排序
var data_table = $('#data-table').DataTable();
data_table.order( [7,'desc'] ).draw();
Hope this helps.
希望这可以帮助。
回答by phaneendra Garapati
$('#id').dataTable( {
$('#id').dataTable({
""aaSorting": [[ "0", "<"desc" or asc>"]]
""asorting": [[ "0", "<"desc" or asc>"]]
});
});