Javascript jquery 数据表默认排序
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8639191/
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 default sort
提问by Mike Flynn
I am trying to set the default sort to the second column in my jquery datatable. It by default sorts by index 0. I am using the "aaSorting": [[ 1, "asc" ]]
syntax but it highlights the column which I don't want on initial load. How can I set the default sort of a specific column without it highlighting the column as if no sorting was involved and the 0 index column was being used.
我正在尝试将默认排序设置为我的 jquery 数据表中的第二列。它默认按索引 0 排序。我正在使用"aaSorting": [[ 1, "asc" ]]
语法,但它突出显示了我在初始加载时不想要的列。如何设置特定列的默认排序而不突出显示该列,就像不涉及排序并且正在使用 0 索引列一样。
采纳答案by Allan Jardine
There are a couple of options:
有几个选项:
Just after initialising DataTables, remove the sorting classes on the TD element in the TBODY.
Disable the sorting classes using http://datatables.net/ref#bSortClasses. Problem with this is that it will disable the sort classes for user sort requests - which might or might not be what you want.
Have your server output the table in your required sort order, and don't apply a default sort on the table (
aaSorting:[]
).
在初始化 DataTables 之后,删除 TBODY 中 TD 元素上的排序类。
使用http://datatables.net/ref#bSortClasses禁用排序类。问题在于它将禁用用户排序请求的排序类 - 这可能是也可能不是您想要的。
让您的服务器按照您所需的排序顺序输出表格,并且不要对表格应用默认排序 (
aaSorting:[]
)。
回答by theJerm
Here is the actual code that does it...
这是执行此操作的实际代码...
$(document).ready(function()
{
var oTable = $('#myTable').dataTable();
// Sort immediately with column 2 (at position 1 in the array (base 0). More could be sorted with additional array elements
oTable.fnSort( [ [1,'asc'] ] );
// And to sort another column descending (at position 2 in the array (base 0).
oTable.fnSort( [ [2,'desc'] ] );
} );
To not have the column highlighted, modify the CSS like so:
要不突出显示该列,请像这样修改 CSS:
table.dataTable tr.odd td.sorting_1 { background-color: transparent; }
table.dataTable tr.even td.sorting_1 { background-color: transparent; }
回答by Zeev Novikov
You can use the fnSort function, see the details here:
您可以使用 fnSort 函数,请参阅此处的详细信息:
回答by ealex_ru
Best option is to disable sorting and just feed data with desired sort order (from database or other source). Try to add this to your 'datatable': "bSort": false
最好的选择是禁用排序并仅提供具有所需排序顺序的数据(来自数据库或其他来源)。尝试将此添加到您的“数据表”中:“bSort”:false
回答by th3byrdm4n
Datatables supports HTML5 data-* attributes for this functionality.
Datatables 支持此功能的 HTML5 data-* 属性。
It supports multiple columns in the sort order (it's 0-based)
它支持排序顺序中的多列(它是基于 0 的)
<table data-order="[[ 1, 'desc' ], [2, 'asc' ]]">
<thead>
<tr>
<td>First</td>
<td>Another column</td>
<td>A third</td>
</tr>
</thead>
<tbody>
<tr>
<td>z</td>
<td>1</td>
<td>$%^&*</td>
</tr>
<tr>
<td>y</td>
<td>2</td>
<td>*$%^&</td>
</tr>
</tbody>
</table>
Now my jQuery is simply $('table').DataTables();
and I get my second and third columns sorted in desc / asc order.
现在我的 jQuery 很简单$('table').DataTables();
,我将第二列和第三列按 desc / asc 顺序排序。
Here's some other nice attributes for the <table>
that I find myself reusing:
这<table>
是我发现自己重用的其他一些不错的属性:
data-page-length="-1"
will set the page length to All (pass 25 for page length 25)...
data-page-length="-1"
将页面长度设置为全部(页面长度为 25 时为 25)...
data-fixed-header="true"
... Make a guess
data-fixed-header="true"
... 做一个猜想
回答by Majid Basirati
I had this problem too. I had used stateSave
option and that made this problem.
Remove this option and problem is solved.
我也有这个问题。我曾经使用过stateSave
选项,这导致了这个问题。
去掉这个选项,问题就解决了。
回答by Bassem Shahin
use this it works for me: "order": [[ 1, "ASC" ]],
使用它对我有用:“order”:[[ 1,“ASC”]],
回答by Colin
This worked for me:
这对我有用:
jQuery('#tblPaging').dataTable({
"sort": true,
"pageLength": 20
});
回答by Akshay Pethani
Just Include the following code:
只需包含以下代码:
$(document).ready(function() {
$('#tableID').DataTable( {
"order": [[ 3, "desc" ]]
} );
}
);
Full reference article with the example:
带有示例的完整参考文章:
https://datatables.net/examples/basic_init/table_sorting.html
https://datatables.net/examples/basic_init/table_sorting.html