FullCalendar - событие с датой изменения

Question

Я использую FullCalendar 2.3.1, и я пытаюсь загрузить оверлей spinner над fullcalendar, как только я нажимаю предыдущий или следующий месяц. я пытался использовать:

var box; 
$("#calendar").fullCalendar({ 
    lang: locale.substring(0, 2), 
    header: { 
     left: 'today prev,next', 
     center: 'title', 
     right: 'month,agendaWeek,agendaDay' 
    }, 
    loading: function(isLoading) { 
     if (isLoading) { 

     } else { 
     } 
    }, 
    dayClick: function() { 
     alert('a day has been clicked!'); 
    }, 
    events: function (start, end, timezone, callback) { 
     $.ajax({ 
      url: "http://"+window.location.host+"/db.php", 
      data: "action=load_allevents", 
      dataType: 'json', 
      cache:false, 
      async:false, 
      success: function (data) { 
       var events = []; 
       $.each(data, function (index) { 
        events.push({ 
         "id"    : data[index].id, 
         "title"    : data[index].room + " (" + data[index].i + ")", 
         "description"  : data[index].room + " (" + data[index].i + ")", 
         "start"    : moment(data[index].startdate), 
         "end"    : moment(data[index].enddate), 
         "backgroundColor" : data[index].color, 
         "textColor"   : "#000000" 
        }); 
       }); 
       callback(events); 
       if (box) 
        box.remove(); 
       startRender = false; 
      }, 
      error: function() { alert('Failed!'); } 
     }); 
    }, 
    eventRender: function(event, element) { 
     if (!startRender) { 
      box = new ajaxLoader(".calendar"); 
      startRender = true; 
     } 
     element.qtip({ content: { text: $.ajax({url:"http://"+window.location.host+"/db.php?action=load_eventdetails&ID="+event.id, async:false}).responseText } }); 
    }, 
    eventMouseover: function(calEvent, jsEvent) { $(jsEvent.target).css('cursor','pointer'); }, 
    eventClick: function(calEvent, jsEvent, view) { 
     alert(calEvent.id); 
    } 
}); 

, так как я думал, что в первый раз я нажимаю на предыдущий или следующий месяц он будет в любом случае стрелять eventRender событие, так что я думал, чтобы проверить, если это был первый вызов eventRender для загрузки вертушку, но загружен только когда все было сделано ... что я пропустил?

Заранее благодарен! Cheers Luigi

Answer 1

eventRender Используется для визуализации чего-то во время проведения мероприятия.

Например: Если вы хотите добавить нестандартное изображение в конце каждого события, выберите название или измените цвет фона события, то вы можете сделать это.

Вы должны использовать «Loading», чтобы он срабатывал при запуске/остановке извлечения события.

Также вам необходимо использовать «lazyfetching».

LazyFetching позволит вашему календарю выбирать события каждый раз при изменении вида (например: prev/next clicked) для загрузки событий в представлении. Таким образом, он не будет извлекаться из кеша.

Используйте код eventAfterRender, чтобы запрограммировать наконечник инструмента, поэтому он будет активирован после завершения обработки события.

lazyFetching: false, 
loading: function(isLoading) { 
    if (isLoading) { 
     if (!startRender) { 
     box = new ajaxLoader(".calendar"); 
     startRender = true; 
     } 
    } 
    }, 
    eventAfterRender: function (view) { 
    if (!startRender) { 
     box = new ajaxLoader(".calendar"); 
     startRender = true; 
    } 
    element.qtip({ content: { text: $.ajax({url:"http://"+window.location.host+"/db.php?action=load_eventdetails&ID="+event.id, async:false}).responseText } });   
    },