How to force Event to new row

Asked by Fabian
4 years ago.

When two events overlap in time they are shown in two distinct rows. This is perfect and exactly what I need. But I have the problem, that when two events are exactly adjacent this does not happen. This causes some problems for me, because you cannot see that one event stops and the other starts (Displayed as if it was one long event). My question is: Can I somehow enforce that the second event is shown in a new row instead of directly after the other in the same row?

how-to javascript

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

Yes, please take a look at the following tutorial:
https://code.daypilot.org/91222/javascript-scheduler-event-placement-strategies

Comment posted by Fabian
4 years ago.

Hi, unfortunately I can't solve my problem with that tutorial. I'll try to be more precise:
The line management works very well in general. If events overlap for one resource, they are placed in different lines, but a later event can reuse a line that 'has become free'. This is exactly the desired behavior. Now, when I have two events which are adjacent (i.e., they follow directly after each other) they are displayed in the same line. This causes problems with my UI, I want them to be handled as if they'd overlap. I want them to be in two different lines (no matter which ones, just free ones).

If I set line: "dedicated" then the lines are not reused and the schedular becomes too large for many events.
I also cannot force a specific line for that case as I don't know the current line and the next free line in case the events are adjacent.

Is there a chance to solve this? Thanks a lot.

Comment posted by Dan Letecky [DayPilot]
4 years ago.

The tutorial I linked shows all events arrangement options that are available at the moment. Your requirement is not doable at this moment and I doubt it will be in the future, as it goes against the basic event arrangement logic.

Instead of changing the arrangement of adjacent events, you may want to try using CSS to style the events in a way that separates them visually, e.g. using a border or blank space.

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