我对我现在正在使用的 Fullcalendar 有疑问。所以我现在正在做的是使用 foreach 创建多个 Fullcalendar。例如,如果循环进行 3 次,就会有 3 个完整的日历,对吗?他们每个人都会有上一个和下一个按钮。我想要一个事件,该事件将根据我单击的完整日历触发,以便我可以调用 api 调用来为每个完整日历显示不同的事件。当 foreach 发生时,我还给了每个 fullcalendar 唯一 ID。
示例:
我将在下面发布我的代码。 从下面的代码中可以看出。我正在创建类名为“calendarSize”的 div 标签,并带有自己的唯一 id,并将 unqiue id 传递给名为“createBiWeeklyCalendar”的函数并呈现该日历。
function createBiweeklyCalendar(a) {
var calendarEl = document.getElementById(a);
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: "dayGridWeek",
});
calendar.render();
}
function createLocation(data) {
data.features.forEach(function (store, i) {
if (i <= 2) {
let prop = store.properties;
let listings = document.getElementById("listings");
let listing = listings.appendChild(document.createElement("div"));
listing.id = "listing-" + prop.id;
listing.className = "item";
let details = listing.appendChild(document.createElement("div"));
let roundedDistance = Math.round(prop.distance * 100) / 100;
details.innerHTML =
"<strong>Distance:</strong> " + roundedDistance + " miles ";
details.innerHTML += "<br/> <strong>Address:</strong> " + prop.address;
let link = listing.appendChild(document.createElement("div"));
link.className = "fieldOffice";
link.innerHTML = "<strong>Field Office:</strong> " + prop.name;
link.innerHTML +=
"<br/><button onClick='callToModal(\"" +
prop.code +
"\");return false;' class='btn mini red-stripe' role='button'>Notes</button>";
link.innerHTML +=
'<div id="' + prop.code + '" class="calendarSize")></div>';
createBiweeklyCalendar(prop.code);
}
});
}