Wie bearbeiten Fullcalender Ereignis Inhalt

Question

Ich bin erfolgreich in das Einbetten der Vollkalander-Steuerelement in meiner asp.net mvc-Anwendung. es läuft perfekt. Aber ich möchte bestehende Veranstaltung bearbeiten, was muss ich machen?

Bearbeitet: ok Ich habe erfolgreich mit Ereignis Edit in Fullcalender Kontrolle getan. aber nachdem das Ereignis bearbeitet wurde, wird es als neues Ereignis angenommen und ersetzt ein anderes Ereignis. Es zeigt mir ein weiteres Ereignis. und wenn ich Seite aktualisiere, dann wird es richtig angezeigt. Also ich denke, nachdem ich das Ereignis bearbeitet habe, einige, wie ich rendern/erneut aufrufen/Seite aktualisieren möchte.

Hier ist der Code:

$(document).ready(function() { 
     var date = new Date(); 
     var d = date.getDate(); 
     var m = date.getMonth(); 
     var y = date.getFullYear(); 
     var officerid = document.getElementById('officerid').value; 
     url = "/TasksToOfficer/Calender/" + officerid; 


     var calendar = $('#calendar').fullCalendar({ 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay', 
       border: 0 
      }, 
     eventClick: function(calEvent, jsEvent, view) { 

       var title = prompt('Event Title:', calEvent.title, { buttons: { Ok: true, Cancel: false} }); 

       if (title) { 
        var st = calEvent.start; 
        var ed = calEvent.end; 
        var aldy = calEvent.allDay; 
        var dt = calEvent.date; 
        var iden = calEvent.id; 

        calendar.fullCalendar('renderEvent', 
              { 
               title: title, 
               start: st, 
               end: ed, 
               allDay: aldy 
              }, 
              true); 


        var date = new Date(st); 
        var NextMonth = date.getMonth() + 1; 
        var dateString = (date.getDate()) + '/' + NextMonth + '/' + date.getFullYear(); 



        if (officerid) { 
         $.ajax(
                { 

                 type: "POST", 
                 url: "/TasksToOfficer/Create", 
                 data: "officerid=" + officerid + "&description=" + title + "&date=" + dateString + "&IsForUpdate=true&EventId=" + iden, 
                 success: function(result) { 

                  if (result.success) $("#feedback input").attr("value", ""); // clear all the input fields on success 

                 }, 
                 error: function(req, status, error) { 

                 } 
                }); 


        } 
       } 

      } 

       , 

      selectable: true, 
      selectHelper: true, 
      select: function(start, end, allDay) { 
       var title = prompt('Event Title:', { buttons: { Ok: true, Cancel: false } 

       }); 
       if (title) { 
        calendar.fullCalendar('renderEvent', 
                   { 
                    title: title, 
                    start: start, 
                    end: end, 
                    allDay: allDay 
                   }, 
               false); // This is false , because do not show same event on same date after render from server side. 
        var date = new Date(start); 

        var NextMonth = date.getMonth() + 1; // Reason: it is bacause of month array it starts from 0 

        var dateString = (date.getDate()) + '/' + NextMonth + '/' + date.getFullYear(); 

        if (officerid) { 
         $.ajax(
                    { 

                     type: "POST", 
                     url: "/TasksToOfficer/Create", 
                     data: "officerid=" + officerid + "&description=" + title + "&date=" + dateString + "&IsForUpdate=false", 
                     success: function(result) { 

                      if (result.success) $("#feedback input").attr("value", ""); // clear all the input fields on success 
                      //$("#feedback_status").slideDown(250).text(result.message); // show status message with animation 
                     }, 
                     error: function(req, status, error) { 

                     } 
                    }); 
        } 
       } 
       calendar.fullCalendar('unselect'); 
      }, 
      editable: true, 
      lazyFetching: true, 
      events: url //this will call the action from controller and show the saved events in db, the result of the action should be in proper formate. 
     }); 
    }); 

ich mit refetchEvent hier versucht, renderEvents für einen Rückruf, aber nicht funktionierte. Gibt es hier noch ein anderes Problem?

Answer 1

Anstatt renderEvent anzurufen, müssen Sie updateEvent anrufen, wenn Sie eine ändern. Beachten Sie auch, dass Sie das updateEvent mit dem "echten" Kalenderereignis versehen müssen, und nicht mit einem solchen. So sollte Ihr Code so gehen:

eventClick: function(calEvent, jsEvent, view) { 
      var title = prompt('Event Title:', calEvent.title, { buttons: { Ok: true, Cancel: false} }); 

      if (title){ 
       calEvent.title = title; 
       calendar.fullCalendar('updateEvent',calEvent); 
      } 
}