Add row number column to jquery datatables

Question

I want jQuery datatables to automatically create row number column in the first column like datagrid in VB.

It looks like this:

Answer 1

As I commented, both @Pehmolelu and @Tao Wang's answer was not working well for me. I had to go with what the DataTables's Index Column advises: https://datatables.net/examples/api/counter_columns.html

Note that in case of me even the column configuration is coming down through an API call of my webapp server (and sometimes I have row counters, sometimes don't), there are 3 system column before this counter column, hence the column index is 3, but you need to adjust it to fit your needs.

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

Also, if your solution is not as complex as mine the link above also shows how you add that column in an unsortable + unsearchable way (again you need to adjust the column index to your needs):

var t = $('#example').DataTable({
    "columnDefs": [{
        "searchable": false,
        "orderable": false,
        "targets": 3
    }],
    "order": [[4, 'asc']]
});

There's also a plugin you may want to utilize instead of your own code.