我的完整日历版本4通过数据库连接运行。一切如预期。我有调度程序许可证，所以我可以使用资源功能。
现在我遇到了一个问题，当我点击一个事件时，会弹出一个模型。比我关闭该模型并打开另一个事件并对该模型执行操作更重要。这两个事件都执行此操作。它看起来像是上次事件中的事件.id。希望有人知道我该如何解决这个问题。当我想删除一个事件并且它删除多个事件时，它不是很有用：-(
这是我的事件点击功能：
eventClick: function (info) {
var id = info.event.id;
var koppeling = info.event.extendedProps.klant_koppeling;
$("#bekijkAfspraak").on("click", "#bekijk_koppel", function (e) {
if ($(this).is(":checked")) {
console.log("Klant koppeling: aan");
koppeling = 1;
} else {
console.log("Klant koppeling: Uit");
koppeling = 0;
}
});
//save changed event information
$("#bekijkAfspraak").on("click", "#show_save", function (e) {
var plaatsnaam = $("input#bekijk_plaatsnaam").val();
var opmerking = $("input#bekijk_opmerking").val();
var klantnaam = $("input#bekijk_klantnaam").val();
var aantal_8 = $("input#bekijk_aantal8").val();
var aantal_14 = $("input#bekijk_aantal14").val();
var actie = $("#bekijk_actie_dropdown").val();
var inladen = $("#bekijk_laad_keuze").val();
var id = info.event.id;
$.ajax({
type: "POST",
url: "php/update_info.php",
data:
"&klantnaam=" +
klantnaam +
"&opmerking=" +
opmerking +
"&id=" +
id +
"&plaatsnaam=" +
plaatsnaam +
"&aantal_8=" +
aantal_8 +
"&aantal_14=" +
aantal_14 +
"&koppeling=" +
koppeling +
"&actie=" +
actie +
"&inladen=" +
inladen,
success: function (response) {
console.log("Geupdate");
Push.create("Afpsraak Geupdate", {
body:
"De afspraak van: " +
plaatsnaam +
" is geupdate Voor klant: " +
klantnaam,
icon: "../assets/afbeeldingen/logo.png",
timeout: 4000,
onClick: function () {
window.focus();
this.close();
},
});
},
});
});
//check cancel clicked on add Modal
$("#afsrpaakAdd").on("click", "#add_cancel", function (e) {
info.event.remove();
});
$("#bekijk_betaald_status").hide();
//set the values and open the modal
$("#bekijkAfspraak").modal("show");
$("#startTime").html(
info.event.start.toISOString().slice(0, 19).replace("T", " ")
);
if (info.event.end == null) {
$("#endTime").html(
info.event.start.toISOString().slice(0, 19).replace("T", " ")
);
} else {
$("#endTime").html(
info.event.end.toISOString().slice(0, 19).replace("T", " ")
);
}
//Voeg afspraak informatie toe
$("input#bekijk_plaatsnaam").val(info.event.title);
// $("input#bekijk_actie").val(info.event.extendedProps.actie);
$("#bekijk_laad_keuze").val(info.event.extendedProps.inladen);
$("#bekijk_actie_dropdown").val(info.event.extendedProps.actie);
$("input#bekijk_opmerking").val(info.event.extendedProps.description);
$("input#bekijk_klantnaam").val(info.event.extendedProps.klantnaam);
$("input#bekijk_aantal8").val(info.event.extendedProps.aantal_8);
$("input#bekijk_aantal14").val(info.event.extendedProps.aantal_14);
var klant_id = info.event.extendedProps.klant_id;
//Delete
$("#bekijkAfspraak").on("click", "#delete", function (e) {
var id = info.event.id;
$.ajax({
type: "POST",
url: "/planner/delete.php",
data: "id=" + id,
success: function (response) {
console.log("Afspraak:", info.event.title + " Is Verwijderd");
$("#bekijkAfspraak").modal("hide");
// planning.refetchEvents();
// info.event.remove();
location.reload();
},
});
});
//maak vervoerslijst aan
$("#bekijkAfspraak").on("click", "#vervoerslijst", function (e) {
var id = info.event.id;
var klantnaam = info.event.extendedProps.klantnaam;
//System id of customer
var klant_id = info.event.extendedProps.klant_id;
var actie = info.event.extendedProps.actie;
console.log("actie", actie);
$.ajax({
type: "POST",
url: "/objects/functions/pdf/examples/example_mobox.php",
data:
"&klantnaam=" +
klantnaam +
"&actie=" +
actie +
"&id=" +
id +
"&klant_id=" +
klant_id,
success: function (response) {
console.log("Voervoerslijst aangemaakt voor klant", klantnaam);
var ifr = document.getElementById("iFramePdf");
if (actie === "LB") {
printJS("/admin/vervoer/leeg/" + klantnaam + ".pdf");
}
if (actie === "LH") {
printJS("/admin/vervoer/leeg/" + klantnaam + ".pdf");
}
if (actie === "VB") {
printJS("/admin/vervoer/vol/" + klantnaam + ".pdf");
}
if (actie === "VH") {
printJS("/admin/vervoer/vol/" + klantnaam + ".pdf");
}
if (actie === "BZ") {
printJS("/admin/vervoer/buiten/" + klantnaam + ".pdf");
}
Push.create("Veroerslijst aangemaakt", {
body:
"Voervoerslijst is juist aangemaakt voor " +
klantnaam +
"Type actie " +
actie,
icon: "../assets/afbeeldingen/logo.png",
timeout: 2000,
onClick: function () {
window.focus();
this.close();
},
});
},
});
});
//verstuur bevesting naar klant
$("#modalBevestig").on("click", "#verstuur", function (e) {
var id = info.event.id;
var start = info.event.start
.toISOString()
.slice(0, 19)
.replace("T", " ");
if (info.event.end == null) {
var end = info.event.start
.toISOString()
.slice(0, 19)
.replace("T", " ");
} else {
var end = info.event.end.toISOString().slice(0, 19).replace("T", " ");
}
var klantnaam = info.event.extendedProps.klantnaam;
//System id of customer
var klant_id = info.event.extendedProps.klant_id;
var actie = info.event.extendedProps.actie;
$.ajax({
type: "POST",
url: "verzendafspraak.php",
data:
"id=" +
id +
"&start=" +
start +
"&end=" +
end +
"&klantnaam=" +
"&klant_id=" +
klant_id +
"&actie=" +
actie,
success: function (response) {
console.log("Afpsraak verstuurd naar klant", klantnaam);
Push.create("Bevestiging gestuurd", {
body: "De bevestiging is juist verstuurd naar " + klantnaam,
icon: "../assets/afbeeldingen/logo.png",
timeout: 2000,
onClick: function () {
window.focus();
this.close();
},
});
$("#modalBevestig").modal("hide");
planning.refetchEvents();
},
});
});
if (info.event.extendedProps.klant_koppeling == 1) {
$("input#bekijk_koppel").prop("checked", true);
$("#bekijk_klant_gegvens").show(1000);
$.ajax({
type: "POST",
url: "/planner/klantController.php",
data: "klant_id=" + klant_id,
dataType: "json",
success: function (response) {
var klantnaam = response.klantnaam;
var telefoon = response.telefoon;
$("input#bekijk_klantnaam").val(klantnaam);
$("input#bekijk_Telefoon").val(telefoon);
//check actie en voeg juiste adres toe
if (
info.event.extendedProps.actie === "VB" ||
info.event.extendedProps.actie === "LH"
) {
$("input#bekijk_adres").val(response.adres2);
$("input#bekijk_inladen").val(response.laden_na);
} else if (
info.event.extendedProps.actie === "LB" ||
info.event.extendedProps.actie === "VH"
) {
$("input#bekijk_adres").val(response.adres1);
$("input#bekijk_inladen").val(response.inladen);
}
if (response.locatie2 == null) {
$("input#bekijk_boxLocatie").val(response.locatie);
} else {
$("input#bekijk_boxLocatie").val(
response.locatie + " " + response.locatie2
);
}
//einde van actie checken
var boxnmrs = response.box1;
var box = [
response.box1,
response.box2,
response.box4,
response.box4,
response.box5,
response.box6,
response.box7,
response.box8,
response.box9,
response.box10,
];
for (var i = 1; i <= 10; i++) {
if (box[i] == null) {
} else {
boxnmrs += " " + box[i];
}
}
$("input#bekijk_boxNummers").val(boxnmrs);
},
});
//end of ajax Klant koppeling
} else {
//Laat geen klant gegevens zien en zet checkbox op false
$("input#bekijk_koppel").prop("checked", false);
$("#bekijk_klant_gegvens").hide();
}
$("input#bekijk_koppel").on("change", function () {
if ($(this).is(":checked")) {
$("#bekijk_betaald_status").hide();
$("#bekijk_klant_gegvens").show(1000);
$.ajax({
type: "POST",
url: "/planner/klantController.php",
data: "klant_id=" + klant_id,
dataType: "json",
success: function (response) {
var klantnaam = response.klantnaam;
var telefoon = response.telefoon;
$("input#bekijk_klantnaam").val(klantnaam);
$("input#bekijk_Telefoon").val(telefoon);
//check actie en voeg juiste adres toe
if (
info.event.extendedProps.actie === "VB" ||
info.event.extendedProps.actie === "LH"
) {
$("input#bekijk_adres").val(response.adres2);
$("input#bekijk_inladen").val(response.laden_na);
} else if (
info.event.extendedProps.actie === "LB" ||
info.event.extendedProps.actie === "VH"
) {
$("input#bekijk_adres").val(response.adres1);
$("input#bekijk_inladen").val(response.inladen);
}
if (response.locatie2 == null) {
$("input#bekijk_boxLocatie").val(response.locatie);
} else {
$("input#bekijk_boxLocatie").val(
response.locatie + " " + response.locatie2
);
}
//einde van actie checken
var boxnmrs = response.box1;
var box = [
response.box1,
response.box2,
response.box4,
response.box4,
response.box5,
response.box6,
response.box7,
response.box8,
response.box9,
response.box10,
];
for (var i = 1; i <= 10; i++) {
if (box[i] == null) {
} else {
boxnmrs += " " + box[i];
}
}
$("input#bekijk_boxNummers").val(boxnmrs);
},
});
//end of ajax Klant koppeling
} else {
$("#bekijk_betaald_status").hide();
$("#bekijk_klant_gegvens").hide(1000);
}
});
//kijk of betaald is
$("#check_paid").click(function () {
//$(this).hide(1000);
$("#bekijk_betaald_status").hide();
$.ajax({
type: "POST",
url: "/planner/klantController.php",
data: "klant_id=" + klant_id,
dataType: "json",
success: function (response) {
console.log("verkrijg klant informatie..");
var betaald = response.betaald;
if (betaald === "ja") {
$("#bekijk_betaald_status").show(100);
$("#bekijk_betaald_status").html(betaald);
console.log("betaald");
} else if (betaald === "nee") {
$("#bekijk_betaald_status").show(100);
$("#bekijk_betaald_status").html(betaald);
console.log("Niet betaald");
} else if (betaald === "nieuw") {
$("#bekijk_betaald_status").show(100);
$("#bekijk_betaald_status").html(betaald);
console.log("Nieuwe klant");
}
},
});
});
},
这是因为每次运行eventClick时，都会运行$("#bekijkAfspraak").on...，它会为按钮创建一个事件处理程序。但是添加事件处理程序不会自动删除以前的事件处理程序！一个元素可以附加许多事件处理程序，所有处理程序都处理同一个事件。因此，下次单击该按钮时，所有附加到该按钮的事件处理程序都将运行。这就是为什么它每次都会再次添加您以前的日历事件。
在添加新按钮之前，您需要使用.off((删除这些按钮上以前的事件处理程序。
例如写入
$("#bekijkAfspraak").off("click", "#show_save")
就在相关的.on()命令将从"show_save"按钮中删除单击处理程序之前。
对eventClick回调中的所有其他对象重复相同的模式。