如何通过单击数据表中的列名来防止排序？

Posted 2023-05-09

【中文标题】如何通过单击数据表中的列名来防止排序？

【英文标题】：How can I prevent ordering by click on column names in datatables?

【发布时间】：2020-11-02 23:44:55

【问题描述】：

我想防止通过单击列名来更改顺序。

我试过了：

"ordering": false,

这实际上消除了点击的可能性。但是订购不再起作用。我想保留它，只阻止用户点击列名。我尝试了以下所有方法：

$(".sorting").addClass('sorting_disabled').removeClass('sorting');

或

$(".sorting").click(function()return false;);

或

  $( ".sorting" ).click(function( event ) 
  event.preventDefault();
);

没有任何效果。

【参考方案1】：

您可以使用以下内容：

$(document).ready(function() 

    var table = $('#example').DataTable( 
        "initComplete": function(settings, json) 
            $('th.sorting').off();
            $("th.sorting").css('cursor', 'default');
            $("th.sorting_asc").css('cursor', 'default');
            $("th.sorting_desc").css('cursor', 'default');
        
     );

    // to show sorting is still possible:
    table.order.listener( '#mysorter', 0 );

 );

这会从表格的列标题中删除排序事件（jQuery off() 函数），并确保鼠标图标在您滚动标题时不会变为手形。

它将箭头留在原处，因此您可以看到有效的排序。

为了显示排序仍然是可能的，我在页面上添加了一个按钮：

<button id="mysorter" type="button">Click Me!</button>

table.order.listener() 使列索引 0 在每次单击按钮时按 asc/desc 排序。

（如果您还想去掉排序箭头，请参阅here。）