Custom Tooltips for Your Calendar

The latest in-app update to DayBack introduces custom tooltips. These tooltips are completely scriptable. You can customize the content and can style the tooltips (and their content) using your own CSS.

How It Works

Tooltips are triggered by a new calendar action: On Event Hover. This new action can call FileMaker scripts or execute JavaScript. It’s JavaScript you’ll use for the tooltips, and you can call a simple function to show any content you’d like. Here’s the Javascript for the example above:

dbk.tooltip(event.title);

That’s passing the event’s title into the tooltip function. You can also pass in more fields and use HTML to make it more readable. Here’s another field (resource), separated by a line break:

dbk.tooltip(event.title + ‘<br />’ + event.resource);

The tooltip documentation covers all this and provides a more thorough description of this JavaScript, lots of examples, and notes on styling this with CSS.

Going Further

There are a lot of possibilities here when you combine the On Event Hover actions running JavaScript inline with tooltips that will show any HTML you put in there. By adding some logic to your JavaScript you can have different tooltips for different kind of events, or show different tooltips on different views. Tooltips have access to any of the JS libraries in DayBack, including momentjs for formatting dates.

Writing tooltips like this is probably the easiest way to get started with JavaScript in FileMaker. You can show meaningful, user-facing results with just a single line of JS, and we can help. Let us know what you’re working on and we can point you in the right direction.

And if you have interesting use cases for running a FileMaker script on hover, we’d love to hear about that too. Don’t forget, you can also add buttons to DayBack to run your own scripts (FileMaker scripts or JavaScript) and buttons may make more sense for some actions. More here: custom button actions in DayBack.

Get It Now

If you’re already using DayBack, tooltips and the new On Event Hover action are free in-app updates. Just click “Check for Updates” from the upper right corner. If you’re new to in-app updates, you can see them in action here: how in-app updates add new features and preserve your customizations.

If you’re not yet using DayBack, download an unlocked trial, link it to your files, and see if it can make a difference for your team’s schedule…

[ba-button link=”https://www.seedcode.com/downloads/” color=”Yellow” target=”self”]  Download an Unlocked 30-Day Trial of DayBack  [/ba-button]

Featured Posts

Follow Along

Stay up to date with the latest news & examples from SeedCode

Leave a Reply

Your email address will not be published. Required fields are marked *

Check out some of our other posts ...

Comments in FileMaker Calendar

Highlight Notes and Comments in Your Calendar

Inline Notes in DayBack Calendar The latest DayBack extension adds an icon to your events when there is a comment present that matches your criteria. You can

Closed Through the New Year

SeedCode is closed for our holiday break from December 19th through the end of the year. We’ll have folks available in case of emergencies and

COMPANY

FOLLOW ALONG

Stay up to date with the latest news & examples from SeedCode

© 2023 SeedCode, Inc.