Ajax 데이터베이스 업데이트 후 전체 일정으로 이벤트 렌더링

Ajax 데이터베이스 업데이트 후 전체 일정으로 이벤트 렌더링

저는 AJAX를 통해 데이터베이스 변경사항을 전체 일정에 반영하려고 합니다.문제는 AJAX 통화 성공 후 화면상의 캘린더가 업데이트되지 않는다는 점입니다.

$.ajax({
    type: "POST",
    url: "eventEditXHR.php",
    data: {
       //the data
    },
    success: function(text) {
      $("#calendar").fullCalendar("refetchEvents");
    }....

제가 잘못된 방법을 사용하고 있다고요?전체 페이지를 다시 로드하지 않고 이 작업을 수행하는 가장 좋은 방법은 무엇입니까?의견을 주셔서 감사합니다!

여러 가지 방법이 있습니다.좀 덜 우아한.

전체 일정관리를 사용하여 json 이벤트를 가져오는 경우:

$('#calendar').fullCalendar({ events: "json-events.php",    });

그냥 하기:

$('#calendar').fullCalendar( 'refetchEvents' );

외부 메서드에서 이벤트를 가져오려면 할 수 있습니다.우아하지는 않지만 작동할 것입니다.

$('#calendar').fullCalendar( 'removeEventSource', source )
$('#calendar').fullCalendar( 'addEventSource', source )

이벤트를 3단계로 렌더링할 수 있습니다.

모든 이벤트 제거

.fullCalendar( 'removeEvents');

이벤트 코스 추가

.fullCalendar( 'addEventSource', events);         

행사를 거행하다.

.fullCalendar( 'rerenderEvents' );

마치...

$.ajax({
    type: "POST",
    url: "eventEditXHR.php",
    data: {       //the data    },
    success: function(events)
      {
              $('#calendar').fullCalendar('removeEvents');
              $('#calendar').fullCalendar('addEventSource', events);         
              $('#calendar').fullCalendar('rerenderEvents' );
       }.
     });

FullCalendar v3.8.0의 경우 다음이 작동합니다.

var events = [
    {title: 'Business Lunch', start: '2017-12-03T13:00:00'},
    {title: 'Meeting', start: '2017-12-13T11:00:00'},
    {title: 'Conference', start: '2017-12-18', end: '2017-12-20'},
];

$('#calendar').fullCalendar({
    defaultDate: '2017-12-12',
    events: function (start, end, tz, callback) {
        callback(events);
    }
});

events.push({title: 'Party', start: '2017-12-29T20:00:00'});
$('#calendar').fullCalendar('refetchEvents');

제이에스빈

이것이 ASP에서 작동하는 것입니다.NET CORE, MVC 6:

 success: function(events)
 {
        $('#calendar').fullCalendar('rerenderEvents');
        $('#calendar').fullCalendar('refetchEvents');
 }

이것이 ASP에서 작동하는 동안.NET MVC 5:

 success: function(events)
 {
       $('#calendar').fullCalendar('refetchEvents');
 }

나에게 맞는 것:

success: function(text) {
                setTimeout(function(){
                    $("#calendar").fullCalendar("rerenderEvents");
                },50);
            }

타임아웃 없이 직접 하면 $element 때문에 작동하지 않습니다.전체 일정 변수가 아직 완전히 설정되지 않았습니까?

한 줄이 작동합니다.

$('#calendar').fullCalendar('refetchEventSources', 'eventEditXHR.php')

답장이 늦었지만, 이것은 2.8.0 이후로 가장 효율적인 방법일 것입니다.

 eventDrop: function (event, delta, revertFunc) {
            var id = event.id;
            var start = event.start.format();

            $.ajax({
                url: getURLRoot() + 'Diary/UpdateEventTimestamp',
                type: "POST",
                data: { id: id, start: start },
                success: function () {
                    $('#calendar').fullCalendar('refetchEvents');
                }
            });
        }

아약스 성공 함수에서 refetec 이벤트를 호출하면 비동기식으로 작동하지 않을 것이라고 생각합니다.하지만 당신이 할 수 있는 것은 아약스의 refetch 이벤트를 완료 함수라고 부르는 것입니다.

          $.ajax({
                    type: "POST",
                    url: "/TaxCalendar/CreateEvent",
                    data: JSON.stringify({ jdata: json }),
                    //data: jdata,
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                    success: function (events) {


                    }, complete: function () {
                        //Call Refetch function here.
                        $('#calendar').fullCalendar('refetchEvents');
                    }
                });

언급URL : https://stackoverflow.com/questions/21204305/rerendering-events-in-fullcalendar-after-ajax-database-update