Search code examples
javascriptjqueryfullcalendarfullcalendar-2

How to prevent highlight (gray background) of an external event in fullcalendar


I already have start and end time for an external event but is there any correct way to set the end time on highlight (gray background) of the same external event.

Or if there is no way to set the end time on highlight then can we remove the fc-highlight completely from external/draggable events.

By the way, I already asked this question but didn't get correct response, so that's why I'm asking again

For more detail, please visit my another question here: Disable highlight of an external event in fullcalendar


Solution

  • For the complete solution check this out: Fullcalendar External/Draggable Events Highlight Effect

    Well after reading the fullcalendar documentation and spent a lot of time on this issue, I come up with a solution and I hope it might help others as well.

    So, the solution is:

    • I've added an option defaultTimedEventDuration which is a default duration of an external/draggable event, if there is no duration set on event.

      e.g: defaultTimedEventDuration: '01:00:00'

    • Also added data-duration in html to get dynamic duration and highlighted effect.

      e.g: <div class='fc-event' data-duration='03:00'>My Event 1</div>

    N.B: Also possibility to set duration attribute in js data