66
Views
6
Comments
Solved
[FullCalendar Reactive] Description is not displayed.
fullcalendar-reactive
Reactive icon
Forge asset by Mediaweb
Application Type
Reactive

Updated to version 2.0.0. 

'resourceTimelineDay' was using Event's Description to display information below the title.


However, after the update, when I switched to the new FullCalender, the Description is no longer displayed.


Is there any option I should add?

(I can't upload the oml.)

2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Yusuke,

Using the FullCalendar block, I also had the same observation. Based on further analysis, I found that the implementation to show event description is disabled due to some reason.

Implemented Code Changes:

  • In the FullCalendar block, introduce a boolean input parameter to control/set the Event Description visibility
  • In the FullCalendar block > BuildOptions screen action, append the below config conditionally based on the Event Description boolean input parameter value.

Code Snippet:

Options + " eventDidMount: function(info) {
                var target = info.el.getElementsByClassName('fc-event-title')[0];
                if (target === undefined) return;
                
                var div = document.createElement('div');
                div.innerHTML = '
' + (!!info.event.extendedProps.description?info.event.extendedProps.description:' ') + '
'; target.parentNode.insertBefore(div.firstChild, target.nextSibling); info.el.setAttribute('data-event-id',info.event.id); }" +"}"

Note: As per the FullCalendar Ver 5 update, use the eventDidMount, instead of the eventRender callback function to append the description in the event block.

Check this: FullCalendar | ResourcesView Demo

Refer to the attached oml

I hope this helps you!


Kind regards,

Benjith Sam

FullCalendarReactive.oml
UserImage.jpg
Yusuke Suzuki

Hi, Benjith 


I added your code to AdvancedOptions and it works. 

Thanks.

2021-03-18 21-03-15
Benjith Sam
 
MVP

You're welcome, Yusuke.

Glad to help you :)


Kind regards,

Benjith Sam

2019-07-05 10-57-41
Nikhil Purohit

Hello @Benjith Sam,

I am facing the same issue, but when I implemented the solution provided by you I get the following error in the image below. Would you be able to help me with it?

Regards,
Nikhil Purohit


2020-12-18 10-43-19
Anna Lysek

Hello, 

I have to take a look at the component's code to see why the description is missing, but I'll get back to you shortly.

2020-12-18 10-43-19
Anna Lysek

Can you create a small example module so that I can look through the code?

By the way, which of the 2 calendar blocks are you using? The one that has the Deprecated prefix or the other one?

2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Yusuke,

Using the FullCalendar block, I also had the same observation. Based on further analysis, I found that the implementation to show event description is disabled due to some reason.

Implemented Code Changes:

  • In the FullCalendar block, introduce a boolean input parameter to control/set the Event Description visibility
  • In the FullCalendar block > BuildOptions screen action, append the below config conditionally based on the Event Description boolean input parameter value.

Code Snippet:

Options + " eventDidMount: function(info) {
                var target = info.el.getElementsByClassName('fc-event-title')[0];
                if (target === undefined) return;
                
                var div = document.createElement('div');
                div.innerHTML = '
' + (!!info.event.extendedProps.description?info.event.extendedProps.description:' ') + '
'; target.parentNode.insertBefore(div.firstChild, target.nextSibling); info.el.setAttribute('data-event-id',info.event.id); }" +"}"

Note: As per the FullCalendar Ver 5 update, use the eventDidMount, instead of the eventRender callback function to append the description in the event block.

Check this: FullCalendar | ResourcesView Demo

Refer to the attached oml

I hope this helps you!


Kind regards,

Benjith Sam

FullCalendarReactive.oml
UserImage.jpg
Yusuke Suzuki

Hi, Benjith 


I added your code to AdvancedOptions and it works. 

Thanks.

2021-03-18 21-03-15
Benjith Sam
 
MVP

You're welcome, Yusuke.

Glad to help you :)


Kind regards,

Benjith Sam

2019-07-05 10-57-41
Nikhil Purohit

Hello @Benjith Sam,

I am facing the same issue, but when I implemented the solution provided by you I get the following error in the image below. Would you be able to help me with it?

Regards,
Nikhil Purohit


Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.