When I prepare DataTable in stimulus controller, it fires twice what is behaviour of turbo (for caching purposes) and therefore I get DataTables error of initializing it twice
When I tried fix as I use in rails6 without stimulus, it does not work
document.addEventListener('turbo:before-cache', function() {
if ($('#invoices_wrapper').length ==1) {invoicetable.destroy() ;} });
If I put console.log inside that function, I see it is not even executed. How can I properly setup DataTables with stimulus?
This is my code
import { Controller } from "@hotwired/stimulus"
import $ from 'jquery';
import 'jszip';
import datatable from 'datatables.net-bs5';
import 'datatables.net-buttons-bs5';
window.datatable = datatable();
export default class extends Controller {
connect() {
var invoicetable = $('#invoices').DataTable({
'order': [1, 'asc'],
'serverSide': true,
"processing": true,
'ajax' : '/invoices.json',
columns: [
//{data: 'id', searchable: false, orderable: false},
{data: 'name' },
{data: 'value' }
],
initComplete: function ()
{
console.log("done")
}
});
}
}