JSFiddle - React, Tailwind, and code Playground
HTML
<script type="text/javascript" src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<button onclick="jqueryRestCall();">
jquery REST call
</button>
<button onclick="datatableRestCall();">
datatable REST call
</button>
<table id="myTable" class="display" border="1"
style="border-color: #f2f2f2">
<thead>
<tr>
<th>userId</th>
<th>id</th>
<th>title</th>
<th>body</th>
</tr>
</thead>
<tbody>
</tbody>
<tfoot>
<tr>
<th>userId</th>
<th>id</th>
<th>title</th>
<th>body</th>
</tr>
</tfoot>
</table>
JavaScript
function jqueryRestCall()
{
console.log("Bla");
var getRequest ={"id":-1,"filterName":"assetFilter"};
getRequest = JSON.stringify(getRequest);
$.ajax({
type : 'POST',
url : "https://jsonplaceholder.typicode.com/posts",
data : getRequest,
dataType : "json",
contentType : "application/json; charset=utf-8"});
}
function datatableRestCall()
{
debugger;
var getRequest ={"id":-1,"filterName":"assetFilter"};
getRequest = JSON.stringify(getRequest);
$("#myTable").DataTable(
{
ajax : {
type : 'POST',
url : "https://jsonplaceholder.typicode.com/posts",
data : getRequest,
dataType : "json",
contentType : "application/json; charset=utf-8"
},
columns : [
{
data : 'userId'
}, {
data : 'id'
}, {
data : 'title'
}, {
data : 'body'
}]
});
}