在全日历中删除事件后清除发布数据答案

【问题标题】：Clear Post data after event delete in fullcalendar在全日历中删除事件后清除发布数据
【发布时间】：2015-09-04 13:01:12
【问题描述】：

我正在使用全日历。当我单击一个事件时，会打开一个模式，您可以在其中选择删除该事件。

当我单击删除时，该事件被删除并启动一个 php 脚本，它将在 ftp 上创建一个文件以与另一个程序同步。这工作正常。当我在下一个事件上单击删除时。 php 脚本创建两个文件。（第一个又是一个新的。

当我在第三个事件上单击删除时，php 脚本会创建 3... 等等。如果我在删除两个事件之间刷新页面没有问题。

我使用$id = $_POST['id']; 从 php 脚本中的事件中获取 id。

这是我在 fullcalendar 中使用的代码：

eventClick:  function(event, delta) {
                $('#modalTitle').html(event.title);
                $('#modalBody').html(   'Start: ' + moment(event.start).format('h:mm') + '</br>' +
                                        'Stop: ' + moment(event.stop).format('h:mm') + '</br></br>' +
                                        'Locatie: ' + event.location + '</br></br>' +
                                        'Info: </br>' + event.description + '</br></br>' +
                                        '<b>Debug info:</b> </br>' +
                                        '           Event id :' + event.id +'</br>' +
                                        '           Resource id :' + event.resourceId +'</br>' +
                                        '           Last modified :' + moment(event.datelastmodified).format('YYYY-MM-DD h:mm:ss')
                                    );
                $('#eventUrl').attr('href',event.url);
                $("#deleteEventBtn").click(function() { 
                                                        $('#calendar').fullCalendar('removeEvents',event._id); //external event, therefore using event._id
                                                        $.ajax({
                                                                url: 'delete_events.php',
                                                                data: '&id='+ event.id ,
                                                                type: "POST",
                                                                success: function(json) {   //refresh calendar on success
                                                                                        $('#calendar').fullCalendar( 'refetchEvents' );
                                                                                            //alert("Updated Successfully");
                                                                                        },
                                                                error: function(json)   {   //refresh calendar on error
                                                                                        $('#calendar').fullCalendar( 'refetchEvents' );
                                                                                        },
                                                                statusCode: {404: function() {alert( "delete_events.php niet gevonden. De wijziging wordt niet opgeslagen." )}},
                                                                });
                                                    });
                $('#DeleteEventModal').modal();
        },

我发现了另一个问题。当我单击一个事件时，模式会打开。当我单击“关闭”以关闭模式并单击下一个事件并选择“删除”时，两个事件都被删除。

编辑： 我想我需要一些像这样的代码：

<script>
$(function(){
$('#DeleteEventModal').on('hidden.bs.modal', function () {
    $('#DeleteEventModal .modal-body').html('');
});})
</script>

这段代码删除了 html-body，我需要它来清除事件 id。每次我单击一个事件时，event.id 都会添加到缓存中（？）。当我点击删除。每个带有缓存 event.id 的事件都会被删除，而不是只删除最后一次点击的事件。

【问题讨论】：

标签： javascript php html fullcalendar

【解决方案1】：

我找到了解决问题的方法。每次在日历中单击事件时，都会将新的处理程序绑定到#deleteEventBtn。因此，当我单击“删除”时，会执行多个处理程序。

工作代码：

eventRender:  function(event, element) {
                element.attr('href', 'javascript:void(0);');
                element.click(function() {
                    $('#modalTitle').html(event.title);
                    $('#modalBody').html(   'Start: ' + moment(event.start).format('h:mm') + '</br>' +
                                            'Stop: ' + moment(event.stop).format('h:mm') + '</br></br>' +
                                            'Locatie: ' + event.location + '</br></br>' +
                                            'Info: </br>' + event.description + '</br></br>' +
                                            '<b>Debug info:</b> </br>' +
                                            '           Event id :' + event.id +'</br>' +
                                            '           Resource id :' + event.resourceId +'</br>' +
                                            '           Last modified :' + moment(event.datelastmodified).format('YYYY-MM-DD h:mm:ss')
                                        );
                    $('#eventUrl').attr('href',event.url);
                    $("#deleteEventBtn").off('click').on('click', function(e) {
                                                            //$('#calendar').fullCalendar('removeEvents',event._id); //external event, therefore using event._id
                                                            $.ajax({
                                                                    url: 'delete_events.php',
                                                                    data: '&id='+ event.id ,
                                                                    type: "POST",
                                                                    success: function(json) {   //refresh calendar on success
                                                                                            $('#calendar').fullCalendar( 'refetchEvents' );
                                                                                                //alert("Updated Successfully");
                                                                                            },
                                                                    error: function(json)   {   //refresh calendar on error
                                                                                            $('#calendar').fullCalendar( 'refetchEvents' );
                                                                                            },
                                                                    statusCode: {404: function() {alert( "delete_events.php niet gevonden. De wijziging wordt niet opgeslagen." )}},
                                                                    });
                    });
                    $('#DeleteEventModal').modal();
                });
        },

【讨论】：