JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.21/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.21/css/jquery.dataTables.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mockjax/2.6.0/jquery.mockjax.min.js"></script>
<button type="button" id="btnReload">reload</button>
<table id="table" class="display" style="width: 100%;">
<thead>
<tr>
<th>Name</th>
</tr>
</thead>
</table>
JavaScript
$.mockjax({
url: '/user/userList.do',
responseTime: 500,
responseText: {
"data": [{
'id': 134132,
'name': 'Tiger Nixon',
},
{
'id': 243345,
'name': 'Garrett Winters',
},
{
'id': 3123214,
'name': 'Ashton Cox',
},
{
'id': 432234,
'name': 'Cedric Kelly',
},
]
}
});
$('#btnReload').click(function() {
$('#table').DataTable({
ajax: {
url: '/user/userList.do'
},
columns: [{
data: 'name'
}]
});
$('#table').DataTable().ajax.reload();
});