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

datatable, javascript, jquery

Solution

Best solution:

"columns": [

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

Problem

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?

Original source

Related problems