I had followed this question to create a table -> Excel table in HTML throught Javascript
My table is connected to a calendar created throught fullCalendar library and I implamented this table in a modal. I also found a way to get the current visualized month as header of the table (by using getView). But now I have this bug: This is how my table show up the first time I open it (it's the correct viewing): normal
and this is how it shows up when I open it the second time, also in a different month: wrong one
These are the mod I did to the code linked to the question added at the begining here:
function renderTable($targetTable, date, view, element ) {
var view = $('#calendar').fullCalendar('getView');
var start = view.intervalStart._d;
var end = view.intervalEnd.subtract(1, 'days');
alert(end);
//prende mese e anno attualmente visualizzati e lo imposta come titolo del modal nell'HTML
const months = ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"];
//calcola il numero dei giorni nel mese (30/31/28)
let numberOfDaysInMonth = new Date(end).getDate(); // just get the last day
//create the table header to display the month and date, and make is span all the days + the names column + the total column.
let $tableHeader = $(`<tr><th colspan="${numberOfDaysInMonth+2}" style="text-align: center;">${months[start.getMonth()]} ${start.getFullYear()}</th></tr>`)
I found the solution
Basically where i call the function that build my table I added this:
//table2 is the ID of my table
var table = document.getElementById('table2');
//i check if the table is empty; if it is than I render the thead and tbody
if (table.rows.length == 0){
var date = new Date();
renderTable($('#table2'), date);
}
//if not, before I delete whats inside and than I render it
else if(table.rows.lenght != 0){
$("#table2 thead").empty();
$("#table2 tbody").empty();
var date = new Date();
renderTable($('#table2'), date);
}