jQuery DataTables中的动态列

Question

在我的应用程序中，有一些列被授予特权。 如果没有给出该列访问该特定列的权限未显示。

我的代码是这样的：http://jsfiddle.net/oscar11/5jccbzdy/11/

// DataTable 
    var table = $('#example').DataTable({ 
     "order": [[0, 'asc']], 
     "drawCallback": function (settings){ 
      var api = this.api(); 

      // Zero-based index of the column containing names 
      var col_name = 0; 

      // If ordered by column containing names 
      if (api.order()[0][0] === col_name) { 
       var rows = api.rows({ page: 'current' }).nodes(); 
       var group_last = null; 

       api.column(col_name, { page: 'current' }).data().each(function (name, index){ 
        var group = name; 
        var data = api.row(rows[index]).data(); 

        if (group_last !== group) { 
         $(rows[index]).before(
          '<tr class="group" style="background-color:' + data[4] + '"><td colspan="5">' + group + '</td></tr>' 
         ); 

         group_last = group; 
        } 
       }); 
      } 
     } 
    }); 

如何使上面的代码变得更具活力和调整被赋予特权的列数？

如果被赋予特权的列数：5，那么：

'<tr class="group" style="background-color:' + data[4] + '"><td colspan="5">' + group + '</td></tr>' 

如果被赋予特权的列数：3，则：

'<tr class="group" style="background-color:' + data[2] + '"><td colspan="3">' + group + '</td></tr>' 

谢谢

Answer 1

SOLUTION

您可以使用columns.name选项为包含颜色的数据列定义名称。

然后在行分组代码中，您可以使用column-selectorcolor:name中的api.column("color:name").index()来获取该列的索引。

使用下面的代码：

// DataTable 
var table = $('#example').DataTable({ 
    "order": [[3, 'asc']], 
    "columnDefs": [ 
     { targets: 3, name: "group" }, 
     { targets: -1, name: "color" } 
    ], 
    "drawCallback": function (settings){ 
     var api = this.api(); 

     // Zero-based index of the column containing group names 
     var col_name = api.column("group:name").index(); 
     var col_color = api.column("color:name").index(); 

     // If ordered by column containing names 
     if (api.order()[0][0] === col_name) { 
      var rows = api.rows({ page: 'current' }).nodes(); 
      var group_last = null; 

      api.column(col_name, { page: 'current' }).data().each(function (group, index){ 
       if (group_last !== group){       
        var color = api.cell({ 
         row: api.row(rows[index]).index(), 
         column: col_color 
        }).data(); 

        $(rows[index]).before(
         '<tr class="group" style="background-color:' + color + '"><td colspan="5">' + group + '</td></tr>' 
        ); 

        group_last = group; 
       } 
      }); 
     } 
    } 
}); 

DEMO

见this jsFiddle代码和演示。