JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<table id="table">
<thead>
<tr>
<th>ID</th>
<th>Status</th>
<th>Name</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>0</td>
<td>Bobby</td>
</tr>
<tr>
<td>2</td>
<td>1</td>
<td>Billy</td>
</tr>
<tr>
<td>3</td>
<td>0</td>
<td>Bo</td>
</tr>
</tbody>
</table>
JavaScript
$(function() {
console.log('Initialization:')
const table = $('#table').DataTable({
columns: [
{data: 'id'},
{
data: 'status',
render: (data, type) => {
console.log('render: I was called')
return data
},
createdCell: (cell, data) => {
console.log('createdCell: I was called')
},
},
{data: 'name'},
],
})
console.log('-------------')
console.log('Updating a cell:')
table.row(2).data({
id: 2,
status: 0,
name: "Billy",
})
console.log('-------------')
console.log('after redraw: ')
table.draw()
console.log('-------------')
})