使dataTables.js jQuery插件无法生成列

Question

我正在使用dataTables.js jQuery插件。

我的表的第一列是行计数器，所以我不希望它可以由用户排序。最后一列包含用户可以在一行上执行的一些操作链接。我怎样才能使这两列无法使用？

注意：我正在使用流水线（服务器端进程）模式的数据表。

Answer 1

aaSortingFixed

此参数是基本相同 到aaSorting参数，但不能被 通过用户交互与 表中重写。这意味着，你可以 具有排序总是 被迫在第一列（可见或隐藏 ） - 之后的任何排序是（从用户），届时将根据需要进行 。这可以是 用于将行分组在一起。使用的

实施例：

$(document).ready(function() { 
    $('#example').dataTable({ 
     "aaSortingFixed": [[0,'asc'],[5,'asc']] 
    }); 
}); 

0是你 '不可排序' 的行数（左起）。 （所以在这个例子中，第一和六分之列是固定的）

Official Documentation

Answer 2

这是通过设置bSortable为false完成：

/* Using aoColumnDefs */ 
$(document).ready(function() { 
    $('#example').dataTable({ 
     "aoColumnDefs": [ 
      { "bSortable": false, "aTargets": [ 0 ] } 
     ] }); 
}); 

/* Using aoColumns */ 
$(document).ready(function() { 
    $('#example').dataTable({ 
     "aoColumns": [ 
      { "bSortable": false }, 
      null, 
      null, 
      null, 
      null 
     ] }); 
}); 

Answer 3

您可以定义一个回调函数的支持不变的号码顺序在单独的列中：

$('#someId').dataTable({ 
     // ... 
     "aoColumns": [ 
      // ... 
      {"bSortable": false}, // set unsortable this column 
      // ... 
     ], 
     fnDrawCallback: function(oSettings) { 
      $(this).find('tbody tr').each(function(index) { 
       $(this).find('td').eq(1).text(index + 1); // .eq([index of column]) 
      }); 
     } 
    }); 

Answer 4

有几种方法禁用对特定列进行排序。

最直截了当的方法是使用所述aoColumnDefs参数来配置列（多个）：

/* 
* aoColumnDefs must be an array of objects (definitions) 
* each definition must contain the aTargets property that 
* specifies the columns on which the definition applies 
* and other properties such as bSortable, bSearchable, bVisible 
*/ 
var aoColumnDefs = [ 
    { 
     "aTargets": [0, 6], 
     "bSortable": false 
    } 
]; 
var dataTable = $('#example').dataTable({ 
    "aoColumnDefs": aoColumnDefs 
}); 

其他的，不灵活的选项是使用aoColumn参数来配置列（多个）：

/* 
* aoColumn must be an array of objects 
* the array size must match the number of columns 
* use null to tell the plugin to use default settings for that column 
*/ 
var aoColumns = [ 
    /* 0 */ { "bSortable": false }, 
    /* 1 */ null, 
    /* 2 */ null, 
    /* 3 */ null, 
    /* 4 */ null, 
    /* 5 */ null, 
    /* 6 */ { "bSortable": false } 
]; 
var dataTable = $('#example').dataTable({ 
    "aoColumns": aoColumns 
}); 

演示：

• Default behavior
• Make un-sortable using aoColumnDefs option
• Make un-sortable using aoColumn option

文档：

• Column options
• Reference

Answer 5

数据表1.10+也supports HTML5 data- style attributes，包括data-sortable="false"，这使得柱没有资格进行排序：

<table> 
    <thead> 
     <tr> 
      <th data-sortable="false">Row</th> 
      <th>Name</th> 
      <th>Join Date</th> 
      <th>Organization</th> 
      <th data-sortable="false">Options</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      [etc] 
     </tr> 
    </tbody> 
</table> 

See this demo in jsFiddle