第一次尝试无法从完整日历中删除事件

Question

我有一个 Bootstrap 模式插件，我试图从中删除在 FullCalendar 中创建的事件。在我第一次尝试删除期间，该事件从日历视图中消失，但 mysql 条目没有被删除。我注意到的原因是calEvent.id 在我最初的删除尝试中没有得到值，但在第二次尝试中calEvent.id 有一个值，我可以成功删除事件。我想知道为什么calEvent.id 在第一次尝试时无法获取事件 ID。使用我在第一次尝试时注意到的警告框，我得到一个结果“未定义”，我猜这是因为没有值即将到来calEvent.id。请在下面找到我的脚本。

$('#event_delete').on('click', function () {                    
    $('#calendar').fullCalendar('removeEvents', calEvent.id);

    $.ajax({
           data: "&id=" + calEvent.id,
           type: "POST",
           url: "http://localhost/book/js/delete_events.php"                    
    });
    alert (calEvent.id);
    CloseModalBox();
});

--------------delete_events.php-----------

<?php
try {
    $bdd = new PDO('mysql:host=localhost;dbname=fullcalendar', 'root', '');
} catch(Exception $e) {
    exit('Unable to connect to database.');
}
$id = $_POST['id'];
$sql = "DELETE from evenement WHERE id=".$id;
$q = $bdd->prepare($sql);
$q->execute();
?>

Answer 1

您可以调用 $('#calendar').fullCalendar('refetchEvents')，而不是重新加载整个页面。它将从您的数据库中获取所有事件并重新呈现它们。

Answer 2

数据应该像这样传递：-

$('#event_delete').on('click', function () {                    
    $('#calendar').fullCalendar('removeEvents', calEvent.id);

    $.ajax({
           data: {id: calEvent.id},
           type: "POST",
           url: "http://localhost/book/js/delete_events.php"                    
          });
          alert (calEvent.id);
          CloseModalBox();
});