jQuery FullCalendar沒有清除事件

Question

我目前正在使用FullCalendar，這非常酷，併爲我做了很多整潔的東西。我遇到的唯一問題是，如果我編輯一個事件，然後嘗試創建另一個事件，那麼JavaScript似乎會保留最初的事件數據。

我使用calendar.fullCalendar（'取消選擇'）當我需要鏈接結束時，但它似乎沒有區別，無論我做什麼。我希望你們能夠看到我忽略的一些東西。

<script type='text/javascript'> 

    $(document).ready(function() { 

     var date = new Date(); 
     var d = date.getDate(); 
     var m = date.getMonth(); 
     var y = date.getFullYear(); 

     var calendar = $('#calendar').fullCalendar({ 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay' 
      }, 
      defaultView: 'agendaWeek', 
      selectable: true, 
      unselectAuto: true, 
      selectHelper: true, 
      editable: true, 
      select: function(start, end, allDay) { 
       //var title = prompt('Event Title:'); 
       //var desc = prompt('Event Description:'); 
       //calendar.fullCalendar('unselect');  

       $('#eventStart').val(start); 
       $('#eventEnd').val(end); 
       $('#eventAllDay').val(allDay); 

       $('#formName').fadeIn(); 

       $('.closeSchedule a').click(function(){ 
        $('#formName').fadeOut('slow'); 

        $('#calendar').fullCalendar('unselect');  
        //alert(jsEvent); 
       }); 
      }, 
      events: [ 
       <?php 

       $first = true; 

       foreach ($events as $event) 
       { 

        if ($first == true) 
        { 
         $comma = ''; 
         $first = false; 
        } 
        else 
        { 
         $comma = ','; 
        } 

        echo $comma." 
        { 
         id: '".$event->id."', 
         title: '".addSlashes($event->title)."', 
         start: '".$event->start."', 
         end: '".$event->end."', 
         allDay: ".$event->allDay." 
        }"; 
        $first = false; 
       } 

       ?> 
          ], 

      eventClick: function(event) { 
       //alert(event.id); 


       $.ajax({ 
        url: './schedule/getEdit/'+event.id, 
        success: function(data) { 
        var formEmpty = $('formName').html(); 
        $('#formName').html(data); 
        $('#formName').fadeIn('fast'); 

        $('.closeSchedule a').click(function(){ 
         $('#formName').fadeOut('slow'); 
         $('#calendar').fullCalendar('unselect'); 
        }); 

        $('#deleteEvent').live('click', function(){ 
         var answer = confirm("Are you sure you wish to delete this event?") 

         if (answer){ 
          $.ajax({ 
           type: "POST", 
           url: "./schedule/deleteEvent/"+event.id, 
           success: function(msg){ 

            $('#formName').fadeOut('fast');    

            calendar.fullCalendar('removeEvents', [event.id ]) 
            $('#calendar').fullCalendar('unselect'); 
           } 
          }); 
         } 

        }); 

        $('#updateEvent').live('click', function(){ 

         var title  = $('#eventName').val(); 
         var trainerID = $('#eventTrainer').val(); 
         var trainer  = $('#eventTrainer option:selected').text(); 
         var classID  = $('#eventType').val(); 
         var eventType = $('#eventType option:selected').text(); 
         var eventStart = $('#eventStart').val(); 
         var eventEnd = $('#eventEnd').val(); 
         var eventAllDay = $('#eventAllDay').val(); 

         if (eventAllDay == 'false') 
         { 
          allDay = false; 
         } 
         else 
         { 
          allDay = true; 
         } 



        // This runs the ajax to add the event to the database. 
        newData = 'title='+title+'&trainerID='+trainerID+'&classID='+classID+'&start='+eventStart+'&end='+eventEnd+'&allDay='+allDay 

        $.ajax({ 
         type: "POST", 
         url: "./schedule/updateEvent/"+event.id, 
         data: newData, 
         success: function(msg){ 

         event.title = title; 

         calendar.fullCalendar('rerenderEvents'); 

         //calendar.fullCalendar('unselect'); 
         $('#calendar').fullCalendar('unselect'); 
         } 
        }); 



        $('#formName').fadeOut('fast'); 
        $('#eventName').val(''); 
        $('#eventTrainer').val(); 
        $('#eventType').val(); 


        }); 
        } 
       }); 

      }, 
      eventDrop: function(event,dayDelta,minuteDelta,allDay,revertFunc) { 


        newData = 'start='+event.start+'&end='+event.end+'&allDay='+allDay 

        $.ajax({ 
         type: "POST", 
         url: "./schedule/updateEventTime/"+event.id, 
         data: newData, 
         success: function(msg){ 

         } 
        }); 
      }, 
      eventResize: function(event,dayDelta,minuteDelta,revertFunc) { 

       newData = 'start='+event.start+'&end='+event.end+'&allDay='+event.allDay 

       $.ajax({ 
        type: "POST", 
        url: "./schedule/updateEventTime/"+event.id, 
        data: newData, 
        success: function(msg){ 

        } 
       }); 

      } 
     }); 



     $('#submitEvent').click(function(){ 
        $('#calendar').fullCalendar('unselect'); 
        var title  = $('#eventName').val(); 
        var trainerID = $('#eventTrainer').val(); 
        var trainer  = $('#eventTrainer option:selected').text(); 
        var classID  = $('#eventType').val(); 
        var eventType = $('#eventType option:selected').text(); 
        var eventStart = $('#eventStart').val(); 
        var eventEnd = $('#eventEnd').val(); 
        var eventAllDay = $('#eventAllDay').val(); 

        if (eventAllDay == 'false') 
        { 
         allDay = false; 
        } 
        else 
        { 
         allDay = true; 
        } 



        // This runs the ajax to add the event to the database. 
        newData = 'title='+title+'&trainerID='+trainerID+'&classID='+classID+'&start='+eventStart+'&end='+eventEnd+'&allDay='+allDay 

        $.ajax({ 
         type: "POST", 
         url: "./schedule/addEvent", 
         data: newData, 
         success: function(msg){ 

         var description = '<ol><li>'+title+'</li><li>'+trainer+'</li><li><a href="#" target="_blank">'+eventType+'</a></li><li class="eventID hide">'+msg+'</li>'; 

         calendar.fullCalendar('renderEvent', 
          { 
           id: msg, 
           title: title, 
           description: description, 
           start: eventStart, 
           end: eventEnd, 
           allDay: allDay 

          }, 
          true // make the event "stick" 
         ); 


         calendar.fullCalendar('unselect'); 
         //calendar.fullCalendar('rerenderEvents') 
         } 
        }); 



        $('#formName').fadeOut('fast'); 
        $('#eventName').val(''); 
        $('#eventTrainer option:selected').removeAttr('selected'); 
        $('#eventType option:selected').removeAttr('selected'); 


     }); 
    }); 

    </script> 

在這一點上，我覺得我已經嘗試了一切，我只是希望一個新的眼睛會看到我錯過了什麼。

Answer 1

好了咋一看它看起來像你是不是有一個空白表格中添加操作初始化形式「選擇：」你的全日曆功能：

在活動中點擊你正在做這個：

$('#formName').html(data); 

我沒有看到你在哪裏用一個空白表格清除新事件。 （可能只是錯過了那裏有很多代碼）

讓我知道。