fullcalender 이벤트 내용을 편집하는 방법

Question

내 asp.net mvc 응용 프로그램에 fullcalender 컨트롤을 포함시키는 데 성공했습니다. 그것은 완벽하게 달리고 있습니다. 하지만 기존 이벤트를 편집하고 싶습니다. 어떻게해야합니까?

편집 됨 : ok fullcalender 컨트롤에서 이벤트를 성공적으로 수정했습니다. 하지만 이벤트를 편집 한 후에는 새 이벤트로 간주하고 오히려 다른 이벤트를 대체하여 하나 이상의 이벤트를 표시합니다. 페이지를 새로 고침하면 올바르게 표시됩니다. 그래서 나는 이벤트를 편집 한 후, 어떻게 렌더링/호출/페이지 새로 고침을하고 싶은지 생각합니다. 여기

코드입니다 : 여기 refetchEvent과 노력

$(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. 
     }); 
    }); 

, 호출 renderEvents 다시,하지만 일을하지. 다른 문제가 있습니까?

Answer 1

renderEvent을 호출하는 대신 변경시 updateEvent으로 전화해야합니다. 또한 "진짜"일정 관리 이벤트를 updateEvent에 제공해야합니다. 따라서 코드는 다음과 같이되어야합니다.

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); 
      } 
}