1. 程式人生 > >DataTables顯示行號及連續自動編號

DataTables顯示行號及連續自動編號

1、在html中新增一個序號列

<table id="dynamic-table">
     <thead>
          <tr>
              <th width="10%">序號</th>
              <th width="45%">專案名稱</th>
              <th width="45%">專案編號</th> 
          </tr>
     </thead>
 
     <tbody>
 
     </tbody>
</table>

2、js中定義一個null的列

var col = [
    	{"data": null},
        {"data": 'projectName'},
        {"data": 'projectCode'}
]

3、datatable

    //為datatable增加序號
    table.on('order.dt search.dt',function(){
    	table.column(0,{
    		search: 'applied',
    		order: 'applied'
    	}).nodes().each(function(cell,i){
    		i = i + 1;
    		var page = table.page.info();
    		var pageno = page.page;
    		var length = page.length;
    		var columnIndex = (i+pageno*length);
    		cell.innerHTML = columnIndex;
    	});
    }).draw();