jquery数据表默认排序

发布于 2024-12-22 17:30:09 字数 165 浏览 0 评论 0原文

我试图将默认排序设置为 jquery 数据表中的第二列。默认情况下,它按索引 0 排序。我使用的是 "aaSorting": [[ 1, "asc" ]] 语法,但它突出显示了我在初始加载时不想要的列。如何设置特定列的默认排序而不突出显示该列,就好像不涉及排序并且正在使用 0 索引列一样。

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.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(9

起风了 2024-12-29 17:30:09

有几个选项:

  1. 初始化 DataTables 后,删除 TBODY 中 TD 元素上的排序类。

  2. 使用 http://datatables.net/ref#bSortClasses 禁用排序类。问题在于,它将禁用用户排序请求的排序类 - 这可能是也可能不是您想要的。

  3. 让您的服务器按照所需的排序顺序输出表格,并且不要对表格应用默认排序 (aaSorting:[])。

There are a couple of options:

  1. Just after initialising DataTables, remove the sorting classes on the TD element in the TBODY.

  2. 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.

  3. Have your server output the table in your required sort order, and don't apply a default sort on the table (aaSorting:[]).

南街女流氓 2024-12-29 17:30:09

这是执行此操作的实际代码...

$(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'] ] );
} );

为了不突出显示该列,请像这样修改 CSS:

table.dataTable tr.odd td.sorting_1 { background-color: transparent; }
table.dataTable tr.even td.sorting_1 { background-color: transparent; }

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:

table.dataTable tr.odd td.sorting_1 { background-color: transparent; }
table.dataTable tr.even td.sorting_1 { background-color: transparent; }
冬天旳寂寞 2024-12-29 17:30:09

您可以使用 fnSort 函数,请参阅此处的详细信息:

http://datatables.net/api#fnSort

You can use the fnSort function, see the details here:

http://datatables.net/api#fnSort

謸气贵蔟 2024-12-29 17:30:09

最好的选择是禁用排序并仅按照所需的排序顺序(来自数据库或其他源)提供数据。尝试将其添加到您的“数据表”中:
“b排序”:假

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

暖风昔人 2024-12-29 17:30:09

Datatables 支持此功能的 HTML5 data-* 属性。

它支持排序顺序中的多列(从 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>

现在我的 jQuery 只是 $('table').DataTables(); 并且我得到了按 desc / asc 排序的第二列和第三列命令。

以下是我发现自己重复使用的 的其他一些不错的属性:

data-page-length="-1" 将把页面长度设置为 All(通过25 表示页面长度 25)...

data-fixed-header="true" ... 猜测一下

Datatables supports HTML5 data-* attributes for this functionality.

It supports multiple columns in the sort order (it's 0-based)

<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.

Here's some other nice attributes for the <table> that I find myself reusing:

data-page-length="-1" will set the page length to All (pass 25 for page length 25)...

data-fixed-header="true" ... Make a guess

時窥 2024-12-29 17:30:09

只需包含以下代码:

    $(document).ready(function() {
        $('#tableID').DataTable( {
            "order": [[ 3, "desc" ]]
        } );
    } 
);

带有示例的完整参考文章:

https://datatables.net/examples /basic_init/table_sorting.html

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

┈┾☆殇 2024-12-29 17:30:09

我也有这个问题。我使用了 stateSave 选项,这导致了这个问题。
去掉这个选项,问题就解决了。

I had this problem too. I had used stateSave option and that made this problem.
Remove this option and problem is solved.

如果没有你 2024-12-29 17:30:09

使用它对我有用:
“顺序”:[[ 1,“ASC”]],

use this it works for me:
"order": [[ 1, "ASC" ]],

夢归不見 2024-12-29 17:30:09

这对我有用:

       jQuery('#tblPaging').dataTable({
            "sort": true,
            "pageLength": 20
        });

This worked for me:

       jQuery('#tblPaging').dataTable({
            "sort": true,
            "pageLength": 20
        });
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文