30 minute time intervals creates a bug from 11:30 - 12

Currently, if we change the time_step property to 30 minutes, when creating events, you can only drag events to 11:30 pm and not till 12 am. If I double click the 11:30-12 am slot, I can create an event but then it displays the event at the top of the scheduler in the "dhx_multi_day’ row.

here is my scheduler setup:

<script src="~/scheduler/dhtmlxscheduler.js"></script>
<link href="~/scheduler/dhtmlxscheduler_material.css" rel="stylesheet" type="text/css" charset="utf-8" />
<script src="~/scheduler/ext/dhtmlxscheduler_recurring.js" type="text/javascript"></script>
<script src="~/Scheduler/ext/dhtmlxscheduler_limit.js" type="text/javascript"></script>
<script src="~/Scheduler/ext/dhtmlxscheduler_collision.js" type="text/javascript"></script>
<script src="~/Scheduler/ext/dhtmlxscheduler_readonly.js" type="text/javascript"></script>

<div id="tab_1_1">
    <div class="row">
        <div class="container-fluid">
            <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100vh;'>
                <div class="dhx_cal_navline">
                    <div class="dhx_cal_prev_button">&nbsp;</div>
                    <div class="dhx_cal_next_button">&nbsp;</div>
                    <div class="dhx_cal_today_button"></div>
                    <div class="dhx_cal_date"></div>
                    <div class="dhx_cal_tab" name="day_tab"></div>
                    <div class="dhx_cal_tab" name="week_tab"></div>
                    <div class="dhx_cal_tab" name="month_tab"></div>
                </div>
                <div class="dhx_cal_header"></div>
                <div class="dhx_cal_data"></div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">

    scheduler.config.time_step = 30;
    scheduler.config.hour_size_px = 88;
    scheduler.config.show_loading = true;
    scheduler.config.collision_limit = 1;

    scheduler.config.start_on_monday = true;
    scheduler.config.details_on_create = true;

    scheduler.init('scheduler_here', null, "week");
</script>

this is what it looks like if I create an event from 11:30 pm to 12am.

Hello, Draklin!

As I understand, you have 2 issues:

  1. the first one deals with display multi-days when you create an event from 23:30 to 00:00 (multi-day line appears at the top of the scheduler)

  2. when I create or resize an event, I can’t drop the end date at 24:00. Drag and drop continue if I release the mouse below 24:00 mark, and if I release the mouse above it - the end date snaps to 23:30. Is it the same issue that you have?
    https://recordit.co/pCRHQr4doB

I tried to repeat the first situation with the part of your code, but I didn’t get it (there is no multi-day row when I double click at the 23:30-00:00).
Can you please reproduce your problem in the snippet?
http://snippet.dhtmlx.com/3e66b1f8b
And can you tell me what version of scheduler do you use?

Regarding the second issue - it appears to be a bug on our end, thank you for reporting it! I’ve submitted it to our internal bug tracker and our dev team will get to it.
I can’t give you any ETA of this fix, unfortunately.

Hello again, @Draklin!

A small update:

  • regarding the issue that “drag and drop” continues if you release the mouse below 24:00 - it is not a bug. Scheduler’s action (dragging in this case) does not finish when the mouse leaves the area of the container with Scheduler. To redefine this behavior, you should catch “onmouseleave” event additionally, and stop dragging in code.

You can find the example that demonstrates how it might be implemented and how it works here: https://snippet.dhtmlx.com/4e9ff14f7

The main idea of this demo is “catching” the end_date of the event when the mouse leaves the scheduler container and set end_date = 00:00 of the next day automatically.

  • regarding the fact that it is almost impossible to set 24:00 while dragging: when you release the mouse between 23:30 and 24:00 - time of end_date is set at 23:30. 24:00 can be set only with a very accurate drop on 24h. I agree that it is not very easy.

We are going to update rounding the event’s time. I.e. in this case, when you drop end_date after 23:45 - time of end_date will be set as 24:00.
I will inform you when our dev team updates it.

1 Like