datatable with html content

Question

I am using jquery datatable and data input injson format.

$('#newItemBasketTab').dataTable({
  "aaData": result.itembasketdata,
  "aoColumns": 
  [
     {"mDataProp": "nic5dcodename"},
     {"mDataProp": "asiccprodcodename"},
     {"mDataProp": "unit_name"},
     {"mDataProp": "prod_quantity"},
     {"mDataProp": "prod_value"}
  ]
});

Now I want to place a checkbox in first column of datatable and based on an ID field in json data, the checkbox needs to be checked or unchecked. Is it possible to add html content to datatable?

Answer 1

You code will look like,

$('#newItemBasketTab').dataTable({
  "aaData": result.itembasketdata,
  "aoColumns": 
  [
     {"mDataProp": "Selection", 
      "fnRender":function(obj, type){
                   if(obj.aData['ID'])
                        return "<input type='checkbox' checked='checked'>"
                   else
                        return "<input type='checkbox'>"
                 }
     }
     {"mDataProp": "nic5dcodename"},
     {"mDataProp": "asiccprodcodename"},
     {"mDataProp": "unit_name"},
     {"mDataProp": "prod_quantity"},
     {"mDataProp": "prod_value"}
  ]
});

You can add any html code that you want to display in fnRender function