Fullcalendar Veranstaltung Endzeit fehlt

Question

I Fullcalendar wih diesen Optionen

defaultEventMinutes:30, 
timeFormat: 'HH:mm { - HH:mm}', 

Ich habe einige Veranstaltungen (30 min lang jeweils) laufen, aber nur ihre Startzeit gezeigt.

10:00 - 
14:30 - 

beim Ziehen ein Ereignis, dessen Start und endtime erscheint, wie ich sein sollte.

10:00 - 10:30 
14:30 - 15:00 

Answer 1

Ich denke, der Grund ist, dass FullCalendar den Titel in die Zeit div stellt, wenn es nicht genug Platz, um den Titel in einer separaten Zeile zu zeigen (was typischerweise der Fall ist, wenn ein Ereignis nur 30 Minuten erstreckt). Wenn die Uhrzeit und der Titel im selben div platziert werden, übergibt FullCalendar nur die Startzeit an das Datumsformatierer.

Um es Ihnen arbeiten zu können Zeilennummer 4020 in fullcalendar.js ändern von (v 1.6.1.):

eventElement.find('div.fc-event-time') 
         .text(formatDate(event.start, opt('timeFormat')) + ' - ' + event.title); 

zu

eventElement.find('div.fc-event-time') 
         .text(formatDates(event.start, event.end, opt('timeFormat')) + ' - ' + event.title); 

Wenn Sie nicht wollen, ändern Im Quellcode von FullCalendar können Sie stattdessen in den Rückruf eventRender schauen.

---

aktualisiert Antwort

Es ist wahrscheinlich besser, dies zu beheben, ohne den Quellcode FullCalendar zu ändern, und es ist eigentlich ziemlich einfach es „der richtige Weg“ zu tun. Die eventRender ist jedoch nicht sehr nützlich, da FullCalendar die Uhrzeit und den Titel nach diesem Callback zusammenfasst und unsere Änderungen überschrieben werden.

Zum Glück gibt es einen anderen Rückruf eventAfterRender, die verwendet werden können:

eventAfterRender: function(event, $el, view) { 
    var formattedTime = $.fullCalendar.formatDates(event.start, event.end, "HH:mm { - HH:mm}"); 
    // If FullCalendar has removed the title div, then add the title to the time div like FullCalendar would do 
    if($el.find(".fc-event-title").length === 0) { 
     $el.find(".fc-event-time").text(formattedTime + " - " + event.title); 
    } 
    else { 
     $el.find(".fc-event-time").text(formattedTime); 
    } 
} 

Hier ist ein Beispiel auf jsfiddle: http://jsfiddle.net/kvakulo/zutPu/

Answer 2

fullcalendar 2.1xxxx Anzeige end time

Editierzeile 5689

return calendar.formatDate(start, opt('timeFormat')); 

zu

return calendar.formatRange(start, end, opt('timeFormat')); 

Answer 3

Die Antwort von Regin für mich nicht funktioniert (ich eine neuere Version von FullCalendar übernehmen).

Ich habe zwei Lösungen gefunden.

Erstens, der einfachste, der das meiste Styling für kurze Ereignisse beibehält. Dadurch wird es wieder auf die Standardeinstellungen zurückgesetzt:

Zweitens können Sie die folgende Logik zum eventAfterRender hinzufügen. Bitte beachten Sie, dass dies andere Auswirkungen haben kann, wenn bestimmte Formen von kleinen Gegenständen anders aussehen, aber wenn dies in Ihrer Umgebung kein großes Problem ist, dann funktioniert das perfekt.

eventAfterRender: function (event, $el, view) { 
       $el.removeClass('fc-short'); 
      } 

Answer 4

FullCalendar v3.0.0

.fc-time-grid-event.fc-short .fc-time:before { 
    content: attr(data-full); 
} 

.fc-time-grid-event.fc-short .fc-time:after { 
    content: normal; 
} 

Answer 5

In den aktualisierten Versionen von FullCalendar von v 2.4.0 gibt es eine Option "displayEventTime", die verwendet werden können, um die Zeit einzustellen, ob in den Ereignissen angezeigt werden .

Hier ist die link.

Durch die globale Einstellung kann die in den Ereignissen angezeigte Zeit ausgeblendet werden.