How to add row number on table genareted by JQuery DataTable with server side datasource

Question

I use JQuery DataTable to bind and show my data. However, I can't add row number to generated grid from client side. Here my code:

HTML

<table id="applications_list" class="table table-bordered datagrid">
    <thead>
        <tr>
            <th><?php echo __('No.'); ?></th>
            <th><?php echo __('Application Code'); ?></th>
            <th><?php echo __('Application Name'); ?></th>
            <th><?php echo __('Created By'); ?></th>
            <th><?php echo __('Created Date'); ?></th>
            <th><?php echo __('Action'); ?></th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

Javascript

$('#applications_list').dataTable({
    "bLengthChange": false,
    "bFilter": true,
    "bFilter": false,
    "bProcessing": true,
    "bServerSide": true,
    "sPaginationType": "full_numbers",
    "sAjaxSource": config.siteURL  + "/applications/ajax_index",
    "sServerMethod": "POST",
    "aoColumns": [
        { "mData": null, "bSortable": false },
        { "mData": "app_applicationcode",  "sName": "app_applicationcode" },
        { "mData": "app_applicationname", "sName": "app_applicationname" },
        { "mData": "app_createdby", "sName": "app_createdby" },
        { "mData": "app_createddate", "sName": "app_createddate" },
        { "mData": "app_applicationcode", "bSortable": false, "mRender": function(data) {
            return '<a href="' + config.siteURL + '/applications/delete/' + data + '" class="confirm_delete"><i class="">x</i></a>' 
        }},
   ],
    "aaSorting": [[ 0, 'asc' ]],
});

I read documentation here, but it won't work. Can anyone help me to solve this problem?

Answer 1

Best solution:

"columns": [

    { "data": null,"sortable": false, 
       render: function (data, type, row, meta) {
                 return meta.row + meta.settings._iDisplayStart + 1;
                }  
    },
......
]