FullCalendar V2 event name

Question

I used the new background events in fullCalendar V2 to show which slots are writable, but I would also like to show some name in the background event. Setting "title" in the event does not show anything.

Is there any way to do this?

thanks

Answer 1

You can use this code. try it.

eventRender: function(event, element){ if(event.source.rendering == 'background'){ element.append("YOUR HTML CODE"); } } 

Answer 2

I changed the "eventRender" calendar so that if the event detects background rendering, also show the title:

 eventRender: function (event, element) { if (event.rendering == 'background') { element.append(event.title); } } 

Answer 3

I recently had a similar problem. I create a simple webapp for myself to manage my work time, and I wanted to use fullcalendar and show how many hours I worked every day. Standard events showing a thin rectangle that didn’t look very good. I noticed that there are background events, so I used them to mark which day I was working. It looked much better as the whole day was allotted. But it seems that I wanted to show some information, namely the hours of the day. So I came up with the following solution. I create two events in a day. First, a background event is created, and in the second, a normal event is created with the title set in the clock, but with the background set to transparent. With a little css help, I will align the text for a standard event. The code for it looks like this:

 $('#calendar').fullCalendar({ eventBackgroundColor: '#ABFFA6', eventColor: 'transparent', eventBorderColor: 'transparent', eventTextColor: '#000', events: [ {"start":"2015-01-02","rendering":"background"}, {"title":"06:10","start":"2015-01-02","backgroundColor":"transparent"}, ] }); 

This code will mark the 2nd of January with a light green background and add a 6:10 label to it. This solution can be extrapolated to other species (for example, day mode).