2015-05-22 157 views
0

我正在使用FullCalendar 2.3.1,並且我正嘗試在單擊上一個月或下一個月時在全格式上加載微調器覆蓋。 我試着使用: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

回答

0

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 } });   
    }, 
+0

你好Prasanth,我試着照你說的,但如果我有被放置在網格中的一些事件一旦我首先單擊上一個或下個月按鈕,它觸發的qtip電話(這是顯示在工具提示中的詳細信息)然後去火加載...爲什麼?.. – Luigino

相關問題