2017-06-05 206 views
0

我正在處理事件cms並使用fullCalendar.io顯示事件。 我的活動只有沒有時間的日期,我將信息存儲在mySQL數據庫中。 雖然我需要在顯示日曆時顯示包含的結束日期,但我沒有辦法改變mySQL列格式或事件插入方法來爲日期添加時間。 我將粘貼我的代碼以顯示它的工作原理。fullCalendar - 包含結束日期

$('#calendar').fullCalendar({   
    header: { 
     left: 'prev,next,today', 
     center: 'title' 
    }, 
    defaultView: 'month', 
    eventSources: [{ 
     url: 'getJsonEvents', 
     type: 'POST', 
     success: function(data) { 
     }, 
     error: function() { 
     }, 
     color: '#2D4047', 
     textColor: 'white', 
    }] 
}); 

存儲日期的列是簡單的DATE mysql列。

編輯: 要清楚,問題是我的事件結束(例如)19日,但在日曆視圖,似乎結束了18日。

Attached image

+2

那麼你的問題到底是什麼?目前還不清楚你的問題是什麼或你想達到什麼目的。你已經顯示了你的代碼(看起來不完整,順便說一句),但沒有說什麼不起作用。 – ADyson

+0

正如我所說的,我需要顯示日曆視圖中包含的結束日期,目前不是(EG:我的活動開始於7月16日和7月19日,但在日曆中該事件似乎結束於18日)附加圖片:http://prntscr.com/fg4s5r – Kevin

回答

0

https://fullcalendar.io/docs/event_data/Event_Object/

「結束」 ......是當下立即後的事件已經結束。對於 例如,如果一個事件的最後一天是週四,該事件的獨家 年底將在00:00:00週五

所以如果你有一個全天的事件,你只需要增加你發送到fullCalendar的「結束」參數的值1天。這是一種非常常見的方法 - 例如,Google日曆的API以相同的方式進行操作。

+0

感謝@ADyson,問題是我從url獲取事件列表。有沒有辦法在渲染日曆之前更改結束日期? – Kevin

+0

絕對。您樣本中的「eventSources」代碼不完整,但看起來您已經大致遵循以下顯示的方法:https://fullcalendar.io/docs/event_data/events_function/。在該函數中,您可以在將事件數據發送到fullCalendar之前對事件數據進行任何操作。在那個例子中,它爲每個事件創建一個全新的對象。你不需要走得太遠,但你可以簡單地修改每個全天事件的「結束」屬性。此回調:https://fullcalendar.io/docs/event_data/eventDataTransform/還允許您執行相同的操作。 – ADyson

+0

再次感謝@ADyson,你能告訴我如何將答案標記爲正確嗎?對不起,但我是新來張貼在StackOverflow。 :) – Kevin