How to display a hyperlink in a cell with jQuery DataTables

Question

I have some Ajax data read into jQuery DataTables. Problem is I need to make the data in the first column into a hyperlink. As in

Answer 1

configure the column definitions via render option:

"render": function ( data, type, row ) {
  return '<a href="#">' + data + '</a>';
}

Answer 2

CAUSE

Option render should be sub-property of either columns or columnDefs.

SOLUTION

Use columnDefs.render option to display hyperlink in a cell dynamically.

For example:

var table = $('#cccr').DataTable({
    /* ... skipepd other options ... */
    columnDefs: [
        {
            targets: 0,
            render: function ( data, type, row, meta ) {
                if(type === 'display'){
                    data = '<a href="basic.php?game=' + encodeURIComponent(data) + '">' + data + '</a>';
                }

                return data;
            }
        }
    ]      
});

DEMO

See this jsFiddle for code and demonstration.