jQuery Datatables - 如何通过编程方式按列排序

13

我有一个数据表:

$(tables[i]).DataTable({
    paging: false,
    searching: false,
    info: false,
    ordering: true,
    autoWidth: false,
    columns: [ ... column stuff here ... 
        {name: "Name"},
        {name: "Account"},
        {name: "Number"}
    ]
});

在代码的后面,我会监听一个按钮的点击事件,以便从表格中获取一些数据,然后按列进行排序。

var columnName = $('.mySelectBox').val();
var columnNumber = 0;

if(columnName === "Account")
    columnNumber = 1;

var table = $(tables[i]).DataTable();

我希望您现在点击此按钮后,可以按列0或列1进行排序。但不要对其他任何列进行排序。
//this doesn't work for me
table.sort( [ [columnNumber, 'desc'] ] );

尝试使用 fnSort 替代 sort?或者在 $(tables[i]).DataTable({ ... }); 中添加 order: [[columnNumber, 'desc' ]] - But I'm Not A Wrapper Class
aaSorting: [[ columnNumber, "desc" ]] 或者如果您想使用fnsort,请在变量中进行dataTable初始化并对该变量进行fnsort。 - loli
@CyberneticTwerkGuruOrc 当我尝试使用fnSort时,它告诉我这不是一个函数。 - SoluableNonagon
你是这样做的吗?myTable.fnSort( [ [columnNumber,'desc'] ] ); - loli
是的,就是那样。 - SoluableNonagon
我还没有尝试过aaSorting,因为我不需要在初始化时进行排序,而是需要通过编程调用来进行排序。 - SoluableNonagon
2个回答

25

我使用 .order() 而不是 .sort()。例如:

$('#dataTables-example').DataTable().order([0, 'desc']).draw();

这里的 0 是列的 ID。


0

您可以使用表格的order方法轻松实现。您可以采用以下技术。

我们需要做两件事情。

  • 获取当前列索引
  • 在单击图标时对特定列应用升序或降序操作

在这里,让我们假设我们有一个按钮或链接来绑定click事件。

$(".arrow-sort-ascending").bind("click", {
 // Sorting should happen here
}

获取列索引

我使用通用的方法来获取列名。如果您正在使用Jquery,我们可以使用以下方法获取列索引。

myColumn = $(parent).prevAll().length

在编程中,parent 应该是特定列的 th

应用升序或降序排序

 // ascending
 myTable.order([myColumn, "asc"]).draw()

如果我们把代码放在一个单独的部分中,它看起来像这样。

table = myTable // This is datatable you initialized

$(".arrow-sort-ascending").bind("click", {table: table}, function(event){
    parent = $(event.target).parent()
    myIndex = $(parent).prevAll().length;
    table.order([myIndex, "asc"]).draw()
}

所以每当我们点击向上箭头图标时,它会对被点击的列进行排序。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接