Adding multiple event data sources are supported. This is convenient when you want to use different event entities or if you have vastly different requirements for your various events in the scheduler.

Open

General

Open

Required settings

The required attributes are a data source, a resource id, a start and end date.

Optional settings

Event id

When an event id is set here it will be set on the scheduler context object when the event changes or and action for an event is performed instead of the event GUID. For more information see “Creating an on change microflow“ below.

Travel time

The before event travel time and after event travel time can be set to display the travel time before or after an event. These values are optional so if you only want to show the travel time for a particular event but not for another event just make sure these values return empty for those events.

Display as read only

The readonly option will effect the look and feel of the event only. It will show the event as “disabled“ when true.

UI

Event content

Render method

The scheduler supports both HTML/Plain text and Mendix widgets for event content. Mendix widgets offer easy configuration and allow the use of standard Mendix components like buttons, layout grids, and images. Additionally, we provide an HTML/Plain text option, which is more performant and thus better suited for handling a large number of events.

Mendix widgets

When to use?

The Mendix widgets option enables you to create event content using standard Mendix components. Keep in mind that complex content and especially the use of additional data sources requiring server roundtrips can negatively affect performance. Limit this complexity if you're dealing with many events, or opt for the HTML/Plain text option when performance is a critical factor.

A note on reactivity

Unlike the HTML/Plain text option, event content defined with Mendix widgets is reactive. This means that changes to an event object attribute will automatically update the event's content without the need for a refresh of the entity.

However, due to current limitations in the Mendix pluggable widget API, this is not the case for properties defined outside the content. Examples hereof are the dynamic event class, style and color. All these properties will require you to refresh the entity. Keep this in mind if you use the Mendix widgets options in combination with any of the dynamic event properties defined in the widget.

HTML/Plain text

Event content can be defined with HTML or plain text.

Sanitizing event content

By default, the event content is filtered to prevent cross-site scripting (XSS). If you require greater control and do not wish to filter this content, you can disable it here. However, please bear in mind that in such cases, you should avoid displaying any user input in the event content.

Event icon class

If an icon class is supplied it will be added to the HTML like so:

You can use regular Mendix glyphicons in the icon class, but you can also utilize the Font Awesome 4 library that comes bundled with the scheduler. However, it's important to read up on how to use it properly in:1.5.2. Icons - Fontawesome 4

Event tooltips

Tooltips using HTML content

Sanitizing tooltip content

By default, the tooltip content is filtered to prevent cross-site scripting (XSS). If you require greater control and do not wish to filter this content, you can disable it here. However, please bear in mind that in such cases, you should avoid displaying any user input in the tooltip content.

Tooltips using Mendix widgets

Using standard Mendix widgets is a much easier way to define tooltips. Additionally, this approach offers the advantage of being able to define various functionalities, such as buttons and conditional visibility, as well.

Styling

There are various ways to style an event: by using a dynamic class or by using the default styles and colors included in the widget.

Using the default styling options

Event styles

The default event style can be chosen and then overridden by the event style, if desired. The event style can also be left blank. If left blank, the default event style will be applied. To apply an event style, you can use a string or the provided enumeration ENUM_EventStyle found in the resources folder of the scheduler module. Like so:

Or when you have an attribute on your object that uses the style enum:

Colors

The default event color can be chosen and then overridden by the event color, if desired. The event color can also be left blank. If left blank, the default event color will be applied. To apply a event color, you can use a string or the provided enumeration ENUM_Color found in the resources folder of the scheduler module. Like so:

Or when you have an attribute on your object that uses the color enum:

Using a dynamic class to style your events

You can define a class to style your events in any way you want. If you don't assign a custom class or if the expression returns empty, the default class will be added to the event wrapper: event-type--default.

Styling events that are being created

When you create new events by dragging them into the scheduler, they will be styled with the default event style and color. Additionally, they will have a class assigned to them so that you can also style new events as per your preference: event-type--creating-new

User interaction

We may want to define actions to call when a user interacts with an event. For the double click action all actions are supported and the scheduler context and event will be passed as a object parameter. There is however a little more to it for the on change action.

Creating an on change microflow

Because of this we have to use a workaround to apply the potentially changed start date, end date and resource id. This is why we need to define attributes for these values on the scheduler context, like shown in the screenshot below:

Whenever a event is changed or created by the scheduler the New/Last moved event data will be updated on the scheduler context object. Since the on change action will receive the scheduler object as a parameter it can be used to update the event.

In the example above you can see a sample of changed microflow. This example simply sets the updated values of the SchedulerContext object on the Event object and commits the changes.

In the example above you can see another sample on changed microflow. This example first retrieves the current values from the database like so:

Alternatively, if using the “Event ID” attribute you can retrieve the object by this attribute instead

Other

Scroll to / highlight event

You can define an attribute that enables you to scroll to and/or highlight an event within the scheduler. In the case of a fixed timeline, the event will only be highlighted, so it must already be visible within the current view for the highlighting to take effect.

When the "Infinite Scroll" feature is enabled, the scheduler goes a step further by scrolling to make the event visible within the timeline. Once the event is in view, it will then be highlighted.

It's important to note that in both scenarios, the event must already be loaded into the scheduler. In other words, the last time the event data source(s) were refreshed, the event should have been included in the results.

The "Scroll to" feature is versatile and can match various types of values, such as integers, strings, dates, etc. Display values are used to identify the correct ID, except when both the "Scroll to" attribute and the event ID attribute use a DateTime format (then the dates will be matched). You can also use the GUID of an object as the identifier if no event id attribute is selected in the event data source. In cases where multiple event sources are in use, it's important to avoid overlapping IDs; otherwise, the first matching ID will be used.

Customize the look and feel of the highlight

To customize the look and feel of the highlight you can override the styling of the following classes: b-fx-highlight and b-fx-highlight-animation. When an element is highlighted the b-fx-highlight class will be added for a specific duration. The b-fx-highlight-animation contains the “pulse” animation and is referred to by b-fx-highlight.

Search in resouces or events

1.4.2. Search in resources or events