Custom rendering when using server side processing

Question

I was wondering if the rendering of the table after receiving an ajax response can be modified. This seems related to the render function described here: https://www.datatables.net/manual/orthogonal-data.

My server returns Data like

{
    "name":       
                       {
                        id: "123456",
                        value: "Tiger Nixon"
                        }
}

I want to add to each name cell the id of the name as data-attribute or as id for the td and want to add a .on( "click", handler ) for each cell.

Is this possible?

Thanks in advance

Gyrocode.com · Accepted Answer · 2015-04-27 20:07:48Z

You can use DT_RowData or DT_RowAttr (requires DataTables 1.10.5 or higher) parameters in your returned data to assign attributes to <tr> element which you can later retrieve in click handler, see Server-side processing chapter in the manual.

Alternatively you can use render method but it may not be as effective. I assumed below that index of your name column is 0 and that you want to set data-id attribute.

var table = $('#example').DataTable({
   "columnDefs": [{
      "data": "name.value",
      "targets": 0,
      "render": function ( data, type, full, meta ) {
         if(type === 'display'){
            $('#example').DataTable().cell(meta.row, meta.col).nodes().to$().attr('data-id', full['name']['id']);
         }

         return data;
      }
   }]
});

You can add click event handler using the code below:

$(document).ready(function(){
    var table = $('#example').DataTable({
       // Define DataTables initialization options here 
    });

    $('#example tbody').on('click', 'td', function(){

       // Use table to access various API function
       //
       // For example:
       // var data_cell = table.cell(this).data();

    });
});

Robin · Accepted Answer · 2015-05-04 12:02:37Z

0

This is possible by using the columns.createdCell function.

The answer of Gyrocode is correct for an old DataTables version.

answered May 4, 2015 at 12:02

Robin

3,92011 gold badges41 silver badges77 bronze badges

1 Comment

Gyrocode.com Over a year ago

According to the manual you're mentioning above createdCell can be used as a complement to columns.render. The code shown in my answer is for the latest DataTables version (1.10.x).

Collectives™ on Stack Overflow

Custom rendering when using server side processing

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related