I am trying to get data from .JSON file and filter it in realtime. But I am getting Warnings as
DataTables warning: table id=example - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3
As per instructions in above link I added retrieve: true, and paging: false, But still warnings are shown. I am new for jscript and jquery so can you please help me to resolve this warning
main.js file
$(document).ready(function () {
var table = $('#example').DataTable({
retrieve: true,
paging: false,
ajax: {
url: './test.json',
dataSrc: '',
},
columns: [
{ data: 'Host' },
{ data: 'Category' },
{ data: 'Type' },
{ data: 'SSH' },
{ data: 'Status' },
{ data: 'Notes' },
],
mark: true,
dom: 'Bfrtip',
lengthMenu: [
[10, 25, 50, 100, -1],
['10 rows', '25 rows', '50 rows', '100 rows', 'Show All']
],
buttons: [
'pageLength',
{
extend: 'copyHtml5',
exportOptions: {
columns: ':visible'
}
},
{
extend: 'excelHtml5',
exportOptions: {
columns: ':visible'
}
},
{
extend: 'csvHtml5',
exportOptions: {
columns: ':visible'
}
},
{
extend: 'print',
exportOptions: {
columns: ':visible'
}
},
{
extend: 'pdfHtml5',
download: 'open',
exportOptions: {
columns: ':visible'
}
},
'colvis'
],
columDefs: [{
targets: -1,
visible: false
}],
});
$('#example tfoot th').each(function () {
var title = $('#example tfoot th').eq($(this).index()).text();
$(this).html('<input type="text" placeholder="Search ' + title + '" />');
});
table.columns().eq(0).each(function (colIdx) {
$('input', table.column(colIdx).footer()).on('keyup change', function () {
table
.column(colIdx)
.search(this.value)
.draw();
});
});
});