2013-07-16 133 views
0

我在這裏看過很多關於fullcalendar的帖子,但沒有一個解決了我的問題。我試圖從外部php文件(JSON提要)加載事件。事件不會在日曆中呈現。FullCalendar - 渲染JSON源

因此,這裏是我的javascript代碼:

<script> 
    $(document).ready(function() { 

     var calendar = $('#calendar').fullCalendar({ 
      defaultView: 'agendaWeek', 
      allDaySlot: false, 
      minTime: 8, 
      maxTime: 17, 
      defaultEventMinutes: 30, 
      weekends: false, 
      selectable: true, 
      selectHelper: true, 
      select: function(start, end, allDay) { 
       if (confirm("Voulez-vous réserver cette période?")) { 

        $('#idMedecin').val('<?php echo $_SESSION["idMedecin"]; ?>'); 
        $('#idPatient').val('<?php echo $patient->numero; ?>'); 
        $('#eventS').val(start); 
        $('#eventE').val(end); 

        $('#calendarForm').submit(); 

       } 
      }, 
      events: { 
       url: 'calendrier-feed.php', 
       type: 'POST', 
       data: { 
        idMedecin: '<?php echo $_SESSION["idMedecin"]; ?>' 
       }, 
       error: function() { 
        alert('there was an error while fetching events!'); 
       } 
      } 

     }); 

    }); 
</script> 

<div id="calendar"> 

</div> 

而這就是我在我的日曆feed.php:

 
getAllEvents($doc); 

foreach($liste as $event) { 

    $event_arr = array(); 
    $event_arr['id'] = $event->id; 
    $event_arr['title'] = $event->patient; 
    $event_arr['start'] = $event->start; 
    $event_arr['end'] = $event->end; 

    array_push($return_arr, $event_arr); 

} 

echo json_encode($return_arr); 

?> 

的JSON輸出如下像這樣:

 
[{"id":"22","title":"ASDC 1234 5434","start":"Mon Jul 15 2013 08:00:00 GMT-0400 (Est (heure d\u2019\u00e9t\u00e9))","end":"Mon Jul 15 2013 08:30:00 GMT-0400 (Est (heure d\u2019\u00e9t\u00e9))"},{"id":"23","title":"ASDC 1234 5434","start":"Mon Jul 15 2013 09:00:00 GMT-0400 (Est (heure d\u2019\u00e9t\u00e9))","end":"Mon Jul 15 2013 09:30:00 GMT-0400 (Est (heure d\u2019\u00e9t\u00e9))"}] 

我完全無能爲力。請幫忙。

感謝

+0

事件格式似乎是罰款,因爲該事件被渲染時, JSON數組直接提供:http://jsfiddle.net/kvakulo/T37Hx/1/。您是否在瀏覽器中使用了devtools來檢查是否有任何AJAX調用,並且它是否成功? –

回答

0

找到了解決辦法。我不得不將這添加到我的calendar-feed.php中:

$ event_arr ['allDay'] = false;

即使它在fullCalendar API中是「可選的」,我仍然必須包含它。

我首先想到的日期是問題,但它沒有任何意義,因爲我從字符串中的select事件捕獲日期並將其填充到mysql中的varchar。

無論如何,問題就解決了:)

0

我用這個插件可以工作爲好, 和我們的區別是日期的結構:

[{"id":"190","allDay":false,"editable":true,"title":"Sam Shift","start":"2013-07-14 18:00:00","duration":"8","end":"2013-07-15 02:00:00","color":"#00f"}] 

您可以查看我的日期比你的要簡單得多,嘗試修復它並檢查。

+0

你的日期格式確實簡單得多。 我會給它一個鏡頭。 – JCharette

1

問題是date結構和"allDay":false

我用這樣的

[{"id":"106","title":"106","start":"2013-07-17T11:00:00+02:00","end":"2013-07-18T14:00:00+02:00","allDay":false,"backgroundColor":"#FF0000"},{"id":"107","title":"107","start":"2013-07-19T10:45:00+02:00","end":"2013-07-20T14:15:00+02:00","allDay":false,"backgroundColor":"#FF0000"},{"id":"108","title":"108","start":"2013-07-22T10:45:00+02:00","end":"2013-07-22T14:15:00+02:00","allDay":false,"backgroundColor":"#FF0000"},{"id":"109","title":"109","start":"2013-07-22T10:45:00+02:00","end":"2013-07-22T14:15:00+02:00","allDay":false,"backgroundColor":"#D7DF01"}]