Available modes:

  • SideBySide
  • Cascade
  • Full

You can change the event arrangement mode using EventArrangement property.

SideBySide

javascript calendar concurrent events side by side

Cascade

javascript calendar concurrent events cascade

Full

javascript calendar concurrent events full

JavaScript

<div id="dp"></div>

<script type="text/javascript">
  var dp = new DayPilot.Calendar("dp");
  dp.eventArrangement = "Cascade";
  // ...
  dp.init();
</script>

ASP.NET WebForms

 
<DayPilot:DayPilotCalendar runat="server" ID="DayPilotCalendar1"
  EventArrangement="Cascade"
  ...
/>

ASP.NET MVC

MVC View

@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig { 

  // ...
  EventArrangement = ArrangementType.Cascade,
  // ...
	
})