DataTables link in column example

An example of putting links in DataTables columns that includes the rows data.

This is done with column render whereby you want to modify the data being outputted by DataTables.

I added this code into the original DataTables Ajax example, it now adds a link in the id column for view.php?id=x where x is the current row id.

Instead of just specifiying the plain columns like:

columns: [
    {data: "id"},
    {data: "guid"},
    {data: "name"},
    {data: "status"}
]

You use the renderer to build a string with/without that rows data:

columns: [
    {
        data: "id",
        render: function (data, type, row, meta) {
            if (type === "display") {
                data = '<a href="view.php?id=' + data + '">' + row.id + '</a>';
            }
            return data;
        }
    },
    {data: "guid"},
    {data: "name"},
    {data: "status"}
]

The row will show the id as a link, you can also include an icon or button instead of dynamic data like:

columns: [
    {
        data: "id",
        render: function (data, type, row, meta) {
            if (type === "display") {
                data = '<a href="view.php?id=' + data + '"><i class="fas fa-eye"></i></a>';
            }
            return data;
        }
    },
    {data: "guid"},
    {data: "name"},
    {data: "status"}
]

This will have the FontAwesome eye icon as a link for view.php?id=x