Jquery DataTables 在排序时将 order 更改为 desc
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3725321/
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 change order to desc when it sorts
提问by John
I am using DataTables to display some data and it works great but I want to customize it slightly and not sure how.
我正在使用 DataTables 来显示一些数据,它的效果很好,但我想稍微自定义一下,但不确定如何自定义。
What I want to do is when a user clicks on a column heading to sort that column I want it to initially order descendingly rather than ascendingly. Is there any way to do this?
我想要做的是当用户单击列标题对该列进行排序时,我希望它最初按降序排列而不是升序排列。有没有办法做到这一点?
回答by SteD
Have a look at this: DataTables sorting direction control example
看看这个:DataTables排序方向控制示例
You can do something like:
您可以执行以下操作:
$(document).ready(function() {
$('#example').dataTable( {
"aoColumns": [
{ "asSorting": [ "desc", "asc" ] }, //first sort desc, then asc
]
} );
} );
回答by veeTrain
The current version of DataTables (1.10) provides the following way of switching this default sorting order with the property orderSequence
under columnDefs
(or columns
but less flexible).
当前版本的 DataTables (1.10) 提供了以下方法来切换此默认排序顺序与属性orderSequence
under columnDefs
(或columns
但不太灵活)。
Here's the documentation on orderSequence
.
这是关于orderSequence
.
"columnDefs": [
{ "orderSequence": [ "desc", "asc"], "targets": [ 1 ] },
]
As it also mentions, you may force a column to onlysort when clicked as DESC or ASC which your interface may very well benefit from.
正如它还提到的,您可以强制一列仅在作为 DESC 或 ASC 单击时进行排序,您的界面可能会从中受益。
In my case, I needed to have columns descending their sort on initial click for an indeterminate number of columns so I decided to switch the example to target a column header's class
name rather than explicitly defining each column as "targets":[1],"targets":[2],...[n]
or programatically building an array of the indices of columns I cared about.
就我而言,我需要在初始单击时对不确定数量的列进行降序排列,因此我决定将示例切换为以列标题的class
名称为目标,而不是将每一列明确定义为"targets":[1],"targets":[2],...[n]
或以编程方式构建索引数组我关心的专栏。
You can target columns multiple ways according to here.
您可以根据此处以多种方式定位列。
The end result is a table definition like so:
最终结果是一个像这样的表定义:
<table><thead><tr>
<th class='descendFirst'>DESCend when first clicked</th>
<th>a normally sorted ASC->DESC->... column</th>
...
</tr></thead></table>
And Data Table empowered as such:
数据表授权如下:
$("#table").dataTable({
"columnDefs": [
{"orderSequence": ["desc","asc"], "targets":"descendFirst" },
]
});
Voila! First click descending sort on all columns with a <th>
marked with a class of 'descendFirst' (an arbitrarily chosen, descriptive class name).
瞧!首先在所有<th>
标有“descendFirst”类(任意选择的描述性类名)的列上单击降序排序。
回答by ozberg
In response to sorting blanks last, here's what I came up with--
(I just HATE blanks sorting first!!)
为了回应最后对空白进行排序,这就是我想出的——
(我只是讨厌首先对空白进行排序!!)
Include these custom sort functions
包括这些自定义排序功能
// 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));
};
Apply the sort tags to the appropriate columns
将排序标记应用于适当的列
// init example
$('#table2').dataTable({
"bJQueryUI": true,
"aoColumns": [
null,
{ "sType": "text-blankslast" },
{ "sType": "text-blankslast" },
{ "sType": "text-blankslast" },
null
]
});
回答by Glen
If anyone else like Dave and myself is looking for a way to set the sort order on all columns, the following may work for you. In order to change the sorting order on all of the columns I set up a loop to alter the settings after the table had instantiated:
如果像 Dave 和我自己这样的其他人正在寻找一种在所有列上设置排序顺序的方法,以下内容可能对您有用。为了更改所有列的排序顺序,我设置了一个循环以在表实例化后更改设置:
$(document).ready(function() {
var example_table = $('#example').dataTable();
$.each(example_table.dataTableSettings[0].aoColumns, function(key, column) {
column.asSorting = [ "desc", "asc" ];
} );
} );
Hope that helps. Tested on jQuery 1.11.0 and DataTables 1.10.0
希望有帮助。在 jQuery 1.11.0 和 DataTables 1.10.0 上测试
回答by Enigma Plus
The only way to get your blank ones last would be a bit of a hack (since the sort is working correctly).
最后获得空白的唯一方法是有点黑客(因为排序工作正常)。
Instead of returning blank values from your server, return something like: "[Blank]"
不要从您的服务器返回空白值,而是返回如下内容:“[Blank]”
I haven't tested it, but I'm pretty sure square brackets will come after alphanumeric codes. Also square brackets traditionally symbolises something that hasn't been completed or confirmed yet.
我还没有测试过,但我很确定方括号会出现在字母数字代码之后。方括号传统上也象征着尚未完成或确认的事情。
回答by Richard
This works for me:
这对我有用:
settings = {
aoColumnDefs: [
{
orderSequence: ["desc", "asc"],
aTargets: ['_all']
}
]};
$('.dataTable').DataTable(settings);