javascript jquery-datatables 多列排序方向
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27527160/
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 multi-column sort direction
提问by sebmoi
Using jquery-datatables.
使用 jquery 数据表。
Example: http://jsfiddle.net/b2fLye17/17/
示例:http: //jsfiddle.net/b2fLye17/17/
$('#example').DataTable({
filter:false,
columnDefs: [
{
targets: [1],//when sorting age column
orderData: [1,2] //sort by age then by salary
}
]
});
When you click the age column, The table sort by age ascending then by salary ascending.
当您单击年龄列时,表格按年龄升序排序,然后按薪水升序排序。
What would be my options to make it sort by age ascending then by salary descending ?
我有什么选择可以按年龄升序然后按薪水降序排序?
Thanks !
谢谢 !
-------------------------- Edit 1 ---------------------
-------------------------- 编辑 1 ---------------------
Clarification : When the age column is sorted ascending it should sort by age ascending then by salary descending. When the age column is sorted descending it should sort by age descending then by salary ascending
说明:当年龄列按升序排序时,应按年龄升序然后按薪水降序排序。当年龄列按降序排序时,应按年龄降序然后按薪水升序排序
-------------------------- Edit 2 ---------------------
-------------------------- 编辑 2 ---------------------
A picture of the desired result
想要的结果的图片
采纳答案by j0xue
Here it is. It's slightly hacked, but I've been spending HOURS trying to figure out the same end goal - sorting off of two columns. http://jsfiddle.net/b2fLye17/23/
这里是。它有点被黑了,但我一直在花费 HOURS 试图找出相同的最终目标 - 整理出两列。http://jsfiddle.net/b2fLye17/23/
<td data-age="40">0</td>
//In custom sort:
var value = parseInt($(td).attr('data-age') + pad(td.innerHTML.substring(1), 10, '0'));
Concept: I haven't figured out a way to access other cells outside of the column in the foreach loop, so I added a "data-" attribute to the cell that we want to sort off of. This data- attribute has the same value as the other sort column that we care about... so there is some duplicate data until we figure out how to access other 'adjacent' cells in the loop.
概念:我还没有想出一种方法来访问 foreach 循环中列之外的其他单元格,所以我向我们要排序的单元格添加了一个“data-”属性。这个 data- 属性与我们关心的另一个排序列具有相同的值......所以有一些重复的数据,直到我们弄清楚如何访问循环中的其他“相邻”单元格。
I combined the two values (hidden attribute and visible value) then converted back to an int to be indexed. Since the values are different lengths, I padded the second column with zeros (4086 vs 40086).
我组合了两个值(隐藏属性和可见值),然后转换回要索引的 int。由于值的长度不同,我用零填充第二列(4086 与 40086)。
回答by fly_ua
Use
利用
$(document).ready(function() {
$('#example').DataTable({
filter:false,
columnDefs: [
{
orderData: [[1, 'asc'], [2, 'desc']]//sort by age then by salary
}
]
});
});
JS Fiddle http://jsfiddle.net/b2fLye17/13/
回答by Avinash Perla
Thanks for asking this question I too faced the same problem then solved as below
感谢您提出这个问题,我也遇到了同样的问题,然后解决如下
var oTable=$('#example').dataTable({
filter:false
});
oTable.fnSort( [[1,"asc"], [2,"desc"]]);
hope this is helpful
希望这是有帮助的
回答by Yveah
You can do var row = settings.aoData._aData[i];
to get all the data from the row and combining that with j0xue solution so you can sort by another column without adding a property in the html.
您可以 var row = settings.aoData._aData[i];
从行中获取所有数据并将其与 j0xue 解决方案相结合,以便您可以按另一列进行排序,而无需在 html 中添加属性。