DataTables - columns.render

DataTables Examples

by snavarro81

HTML

<link rel="stylesheet" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css">
<script src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<table class="display" id="example">
    <thead>
        <tr>
            <th>Information</th>
            <th>Link</th>
        </tr>
    </thead>
</table>

JavaScript

var responseObj = [
    { "information": "A1", "weblink": true },
    { "information": "A2", "weblink": false },
    { "information": "A3", "weblink": true },
    { "information": "A4", "weblink": true }
];

$('#example').dataTable({
   "data": responseObj,
   "bDestroy": true,
   "deferRender": true,
   "columnDefs": [
     { 
      "data": "information",
      "targets": 0
    	 
      }, 
    	{ 
       "data": "weblink" ,
				"targets": 1,
        "render" : function(data, type, row, meta){
            if(type === 'display'){
                if (data){
                    return $('<span class="glyphicon glyphicon-ok">')
                        .wrap('<div></div>')
                        .parent()
                        .html();
                }
                else
                {
                 return $('<span class="glyphicon glyphicon-ban-circle">')
                        .wrap('<div></div>')
                        .parent()
                        .html();
                }
            } else {
                return data;
            }
        }
    }
   ]
});