Forum : problème de boucle javascript

Bonjour,

Voila je suis en train de developper un tableau qui recupère les horaires de la semaine selectionné depuis une base de donné local.(nedb)
cela fonctionne correctement sauf que lorsque je change plusieur fois a la suite la semaine, il y a une boucle qui reviens 2 fois puis 3 fois .... jusqua faire planter l'application
Je début dans le javascript, et je ne trouve pas la boucle qui s'ajoute a chaque click.

const { data } = require("jquery"); $(document).ready(function () { //charger BDD var Datastore = require("nedb"), db = new Datastore({ filename: "datacalendar.db", autoload: true }); //recupere le numero de la semaine var dateShowed = document.getElementById("titreTable"); dateShowed.innerHTML = "Semaine" + " " + moment().week(); selectableDate = new Date(); // console.log("new date",selectableDate); const prevMonth = document.getElementById("prevMonth"); const nextMonth = document.getElementById("nextMonth"); ///moment passer en fr debut lundi/// moment.updateLocale("fr", { week: { dow: 1 } }); ///*********************************************************************** */ loadTableLignes = function (date) { console.log("***date", date); //gestion du click sur les Btns + modif du mois prevMonth.addEventListener("click", () => { selectableDate = moment(date); selectableDate = selectableDate.subtract(1, "week"); selectableDate = moment(selectableDate); dateShowed.innerHTML = "Semaine" + " " + selectableDate.week(); loadTableLignes(selectableDate); }); nextMonth.addEventListener("click", () => { selectableDate = moment(date); dateShowed.innerHTML = selectableDate.add(1, "week"); selectableDate = moment(selectableDate); dateShowed.innerHTML = "Semaine" + " " + selectableDate.week(); loadTableLignes(selectableDate); }); let currentWeek = moment(date).startOf("week"); let nextWeek = moment(date).endOf("week"); db.find({}, function (err, docs) { // filtre la semaine select let filteredEvents = docs.filter(function (docs) { let eventDate = moment(docs.start); return eventDate.isBetween(currentWeek, nextWeek); console.log(filteredEvents); }); filteredEvents.sort(function (a, b) { return new Date(a.start) - new Date(b.start); }); console.log("allfiltre", filteredEvents); var tableRegistre = document.getElementById("dataTable"); var tableRows = tableRegistre.querySelectorAll("thead > tr"); //on supprime les ligne tableRows.forEach((el, i) => { if (i > 0) el.parentNode.removeChild(el); }); /////filtre Cindy/// let selectedCindy = filteredEvents.filter((el) => el.title == "Cindy"); const startEndCindy = selectedCindy.map( (event) => `${event.start.toString().substring(11, 16)} - ${event.end .toString() .substring(11, 16)}` ); let selectedPierre = filteredEvents.filter((el) => el.title == "Pierre"); const startEndPierre = selectedPierre.map( (event) => `${event.start.toString().substring(11, 16)} - ${event.end .toString() .substring(11, 16)}` ); let selectedJean = filteredEvents.filter((el) => el.title == "Jean"); const startEndJean = selectedJean.map( (event) => `${event.start.toString().substring(11, 16)} - ${event.end .toString() .substring(11, 16)}` ); const dateFrtableau = selectedJean.map((event) => `${event.start}`); let formattedDates = dateFrtableau.map((dateString) => { let date = new Date(dateString); let options = { weekday: "long", day: "numeric", month: "long" }; return date.toLocaleDateString("fr-FR", options); }); console.log("format date", formattedDates); // boucle le tableaux for (var i = 0; i < startEndCindy.length; i++) { for (var i = 0; i < startEndPierre.length; i++) { for (var i = 0; i < startEndJean.length; i++) { for (var i = 0; i < formattedDates.length; i++) { //creation d'une ligne var row = tableRegistre.insertRow(i + 1); //creation des cellules var cell1 = row.insertCell(0); var cell2 = row.insertCell(1); var cell3 = row.insertCell(2); var cell4 = row.insertCell(3); //injecter le contenu des cellules cell1.innerHTML = formattedDates[i]; cell2.innerHTML = startEndCindy[i]; cell3.innerHTML = startEndJean[i]; cell4.innerHTML = startEndPierre[i]; } } } } }); }; loadTableLignes(selectableDate); });

voici mon code complet ainsi qu'une capture pour mieux comprendre mon projet.
[(https://postimg.cc/JDG9LnL7)]

problème de boucle javascript

5 réponses