Tooltip not showing

Asked by Iñigo
6 years ago.

Hi!
I am trying to make a demo of the Javascript calendar based on your Angular 2+ calendar tutorial and so far it's great but I've run into a problem trying to show the tooltips.

I've set up a property on each event called "toolTip", as the documentation says, but it doesn't show anything. I've read on the forums that the tooltip is rendered as a "title" attribute and inspecting the events, there is no "title" attribute.

I've put a "onBeforeEventRender" event and in it I've put a console.log to be sure:

{…}
data: Object { id: 23, text: "Tutoretza", mota: 1, … }
e: {…}
cssClass: "tutoretza"
end: Object { value: "2017-10-30T13:20:00", … }
id: 23
start: Object { value: "2017-10-30T13:00:00", … }
text: "Tutoretza"
toolTip: "proba"
__proto__: Object { … }
__proto__: Object { … }

But nothing shows up :(

Am I missing something? I've read on the documentation that the tooltips are enabled by default... so, do I need to put anything else?

I have also been looking at the bubbles documentation, but I'm not sure how to set it up as the documentation is only for the Javascript mode and I don't know how to initialize it.

Thanks!

Answer posted by Dan Letecky [DayPilot]
6 years ago.

The tooltip is automatically turned off if you turn on a bubble. In the latest DayPilot Pro version, the bubble is now automatically turned on (a new DayPilot.Bubble() object is assigned to "bubble" property).

There are two options:

1. You can use the bubble instead - just specify the bubble text using "bubbleHtml" property of the event data:

{
  id: 23,
  text: "Tutoretza",
  // ...
  bubbleHtml: "My tooltip"
}

I would recommend using the bubble since it is more flexible (you can use HTML instead of plain text and you can customize the appearance and behavior).

2. You can turn off the bubble by setting the "bubble" property to null in the config:

  config: any = {
    bubble: null
  }

This will enable the tooltip based on "title" HTML attribute.

Comment posted by Iñigo
6 years ago.

Thanks! Works perfectly :D

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

Tooltip not showing

Products

Learn

Get Support

DayPilot Pro