Events Cascading in week view

Scheduler
#1

I have the following config code set but my events are still cascading in the week view. Any idea how to fix this? I’m using v5.3.9

scheduler.config.cascade_event_display = false;
scheduler.config.separate_short_events = true;

image
image1036×795 23.9 KB

Thanks
Justin

#2

Any thoughts on how to get these laying out next to each other vs cascading?

#3

Hello @jwilliquor ,

I tried to reproduce this behavior, but events displayed as expected:

The issue can be connected with some of the additional configurations, but it’s hard to suggest what exactly goes wrong without more details.
Could you please provide me a detailed instruction on how to reproduce the issue, or reproduce it in the demo below(reproduce => click the “Share” button => send me the new link):
http://snippet.dhtmlx.com/5/336bb2fdd

Kind regards,

#4

So I found I had a bug in my code that did this

scheduler.attachEvent(“onBeforeViewChange”, function(old_mode,old_date,mode,date){
if(mode === ‘week’){
scheduler.config.cascade_event_display = false;
}
}

Now that my events are not cascading i’m seeing a gap before the first event. Do you know what property or css entry causes that?

image
image772×671 23.7 KB

#5

Hello @jwilliquor ,

Sorry for the delay.
It looks like you applied some additional styling to get the following result.
The easiest way to find which CSS does this - is to test your app in the browser dev tools(F12 in chrome) and disable event card styles one by one:

to find the required CSS.

Here is list of selectors for event cards:

.dhx_cal_event//  - usual event
.dhx_cal_event_selected// - selected event
.dhx_cal_event_line  // multiday event

I tested some different styles, and achieved the quite similar result that you has with follows:

  .dhx_cal_event:not(.dhx_cal_select_menu)  {
    left: 10px !important; 
  }
  .dhx_cal_event.dhx_cal_select_menu.dhx_cal_event_selected {
  	margin-left: 10px !important;
  }
  .dhx_scale_holder{
  	overflow: hidden;
  }