This relates to datatables 1.10.x.

I'm using this reference to create child rows, and it's easy to put HTML inside of the javascript code that's genereated, like this:

function format ( d ) {
    return '<div class="slider">'+ 
    '<table id="expandInput" cellpadding="5" cellspacing="0" border="0" style="margin: 0 auto;">'+                
        '<tr>'+
            '<td class="dropHeader">Cost</td>'+
            '<td class="dropInfo"><input required type="text" id="cost" name="cost" value="'+d.cost+'"></input></td>'+                
        '</tr>'+                       
    '</table>'+
   '</div>'; 
}

But this only affects the child child that's generated on-click. I have no idea how to create an id or name using the standard datatables syntax for the cells that datatables itself generates. The only example i was able to find on datatables' website relates to creating an id using server side

var table = $('#ltc-table').DataTable( {    
    "data" : json,        
    "columns" : [
      { data : 'cost' },
      { data : 'resale' }
  ],
  "columnDefs": [
  { className: "details-control", "targets": [ 0 ] }
  ]
});

I know I can set a class of a td using columnDefs, as demonstrated here, but I can't figure out how to add additional criteria, and I need to set a unique id and name for each td that's genereated.

This relates to datatables 1.10.x.

I'm using this reference to create child rows, and it's easy to put HTML inside of the javascript code that's genereated, like this:

function format ( d ) {
    return '<div class="slider">'+ 
    '<table id="expandInput" cellpadding="5" cellspacing="0" border="0" style="margin: 0 auto;">'+                
        '<tr>'+
            '<td class="dropHeader">Cost</td>'+
            '<td class="dropInfo"><input required type="text" id="cost" name="cost" value="'+d.cost+'"></input></td>'+                
        '</tr>'+                       
    '</table>'+
   '</div>'; 
}

But this only affects the child child that's generated on-click. I have no idea how to create an id or name using the standard datatables syntax for the cells that datatables itself generates. The only example i was able to find on datatables' website relates to creating an id using server side

var table = $('#ltc-table').DataTable( {    
    "data" : json,        
    "columns" : [
      { data : 'cost' },
      { data : 'resale' }
  ],
  "columnDefs": [
  { className: "details-control", "targets": [ 0 ] }
  ]
});

I know I can set a class of a td using columnDefs, as demonstrated here, but I can't figure out how to add additional criteria, and I need to set a unique id and name for each td that's genereated.

• javascript
• jquery
• datatables

Share Improve this question Follow edited May 29, 2015 at 19:08 Brian Powell asked May 29, 2015 at 18:56 Brian PowellBrian Powell 3,41144 gold badges3737 silver badges6464 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 11

You need to use createdRow property to define callback for whenever a TR element is created for the table's body.

$('#example').dataTable( {
   "createdRow": function ( row, data, index ) {
      $('td', row).eq(1).attr('id', 'td-' + index + '-1');
   }
});

Code $('td', row).eq(1) is used to select second cell in the table row using zero-based index (1 for second cell). Code attr('id', 'td-' + index + '-1') will set that cell id attribute to td-0-1 for first row, td-1-1 for second row, etc., where index is zero-based row index.

See this JSFiddle or Row created callback example for demonstration.

In my case it work with 'rowData'. Some code:

$('#example').dataTable({
    "columnDefs": [{
        'targets': [4], 'createdCell': function (td, cellData, rowData, row, col) {
            td.id = "ID_For_TD_" + rowData.ObjId;
        }
    }],
});