search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

How to handle object data inside html property in the Scheduler?

Asked by pushplata
4 months ago.

Hi,

I'm trying to put <b>{object.name}</b> inside html property for events but I'm getting [ object. Object] as response in the view. Kindly help how to handle the object data.

Thanks in advance

Answer posted by Dan Letecky [DayPilot]
4 months ago.

In React, the "html" property supports a string with HTML, but not JSX.

You can use JavaScript template literal (with backtick quotes) to insert variables into the HTML string. However, remember that the value isn't HTML-encoded in this case:

onBeforeEventRender: args => {
  const object = /* ... */ ;
  args.data.html = `<b>${object.name}</b>`;
}

You can also use JSX but you'll need to use onBeforeEventDomAdd event instead.

Please see the following tutorial for an example:
https://code.daypilot.org/50584/react-scheduler-rendering-jsx-in-events

It's also good to keep in mind that using JSX brings some overhead. It may be noticeable when there are many events in the current Scheduler viewport.

This question is more than 3 months old and has been closed. Please create a new question if you have anything to add.