将索引列添加到数据表

试试这个。

"render": function ( data, type, full, meta ) {
    return  meta.row + 1;
} },

这个概念是你必须在javascript或服务器中创建初始的"Index"值。这些值可以是零，也可以只是空字符串或其他任何值（无需计算计数器或其他内容）。例如，您可以在收到数据后在javascript中创建一个索引列：

for (var i=0; i<data.length; i++){
        data[i].index = 0;
    }

因此，现在您的数据中有了索引列，您可以将其声明为表的第一列：

$('#example').dataTable( {
  .....
  "columns": [
    { "data": "index" },
    { "data": "engine" },
    { "data": "browser" },
    { "data": "platform" },
    { "data": "version" },
    { "data": "grade" }
  ]
} );

现在索引值均为 0。若要创建将显示在表中的实际索引值，您需要添加一个侦听表的排序和搜索的事件处理程序。在这些事件中，实际指数值将按照数据表示例：

datatable_object.on( 'order.dt search.dt', function () {
    datatable_object.column(0, {search:'applied', order:'applied'}).nodes().each( function (cell, i) {
        cell.innerHTML = i+1;
    } );
} ).draw();

当搜索或排序表时（默认情况下在创建表时进行排序 - 请参阅排序选项的默认值），将根据行的索引计算"索引"单元格的 innerHtml。

需要使用DT_RowIndex来索引行。像这样 -

"columns": [
{ "data": 'DT_RowIndex'}, // row index
{ "data": "engine" },
{ "data": "browser" },
{ "data": "platform" },
{ "data": "version" },
{ "data": "grade" }
]

只需将下面的代码添加到数据表中

{ 'data': 'id', defaultContent: '' },
"columnDefs": [   ////define column 1 , make searchable false 
    {
        "searchable": false,
        "orderable": false,
        "targets": 0
    },

以下是更新的代码：

 var table=$('#example').dataTable( {
     "ajaxSource": "sources/objects.txt",
     "columns": [
         { 'data': 'id', defaultContent: '' },
         { "data": "engine" },
         { "data": "browser" },
         { "data": "platform" },
         { "data": "version" },
         { "data": "grade" },
     "columnDefs": [   ////define column 1
         {
             "searchable": false,
             "orderable": false,
             "targets": 0
         },
     ]
});

以下行将向您id(index)列添加数字：

if (t.data().length != 0) {
    t.on('order.dt search.dt', function () {
        t.column(0, { search: 'applied', order: 'applied' }).nodes().each(function (cell, i) {
            cell.innerHTML = i + 1;
            t.cell(cell).invalidate('dom');
        });
    }).draw();

现场示例：http://live.datatables.net/woboviqi/2/edit

你可以使用 unshift（）

"columns": [
    { "data": "engine" },
    { "data": "browser" },
    { "data": "platform" },
    { "data": "version" },
    { "data": "grade" }
].unshift({"data" : "Index"})

或者通过使用临时数组

var cols = [{
    "data": "engine"
}, {
    "data": "browser"
}, {
    "data": "platform"
}, {
    "data": "version"
}, {
    "data": "grade"
}];
cols.unshift({
    "data": "Index"
})
....
"columns": cols

看看这个网址： 数据表 索引列

它可能会对你有所帮助。

这是我的代码，你可以参考：

1. 我的数据表是完全自定义的。
2. 我正在使用Ajax和CodeIgniter从数据库中获取数据。

.HTML

<table width="100%" class="table table-striped table-hover" id="table_id_dataTable">
  <thead>
    <tr>
      <th>Sr No</th>
      <th>Column 2</th>
      <th>Column 3</th>
      <th>Column 4</th>
      <th>Column 5</th>
    </tr>
  </thead>
  <tfoot>
    <tr>
      <th>Sr No</th>
      <th>Column 2</th>
      <th>Column 3</th>
      <th>Column 4</th>
      <th>Column 5</th>
    </tr>
  </tfoot>
  <tbody>
  </tbody>
</table>

JS脚本

var temp_table = $('#table_id_of_dataTable').DataTable({
  "language": {
    "zeroRecords": "No records found."
  },
  "ajax": {
    "type": "POST",
    "url": "<?php echo base_url('Controller/method'); ?>"
  },
  "responsive": true,
  "columnDefs": [
    {
     "searchable": false,
     "orderable": false,
     "targets": 0
    }
  ],
  "order": [
    [1, 'asc']
  ],
  "columns": [
    { "data": null }, // <-- This is will your index column
    { "data": "column_2_element_name_given_in_controller" }, 
    { "data": "column_3_element_name_given_in_controller" }, 
    { "data": "column_4_element_name_given_in_controller" }, 
    { "data": "column_5_element_name_given_in_controller" }
  ]
});
// Here we create the index column in jquery datatable
temp_table.on('order.dt search.dt', function() {
  temp_nuggets_table.column(0, {
    search: 'applied',
    order: 'applied'
  }).nodes().each(function(cell, i) {
    cell.innerHTML = i + 1;
  });
}).draw();

希望对您有所帮助！

这很简单...这对我来说是有用的。

Cell: function ( data, type, full, counter ) {
        return  data.index + 1
}

在此处输入链接描述

Try this: 
var table=$('#example').dataTable( {
     "ajaxSource": "sources/objects.txt",
     "columns": [
        {
                    "data": null, "render": function (data, type, full, meta) {
                        return meta.row + 1;
                    }
         },
         { "data": "engine" },
         { "data": "browser" },
         { "data": "platform" },
         { "data": "version" },
         { "data": "grade" }
     
});
table.on('order.dt search.dt', function () {
        table.column(0, { search: 'applied', order: 'applied' }).nodes().each(function (cell, i) {
            cell.innerHTML = i + 1;
        });
    }).draw();

在此处输入链接描述

Try this: 
var table=$('#example').dataTable( {
     "ajaxSource": "sources/objects.txt",
     "columns": [
        {
                    "data": null, "render": function (data, type, full, meta) {
                        return meta.row + 1;
                    }
         },
         { "data": "engine" },
         { "data": "browser" },
         { "data": "platform" },
         { "data": "version" },
         { "data": "grade" }
     
});