DayPilot Knowledge Base

AJAX Calendar/Scheduling Controls
DayPilot Pro (AJAX Calendar Control)
» DayPilot AJAX Calendar
DayPilot Pro (AJAX Monthly Calendar Control)
» DayPilot AJAX Monthly Calendar
DayPilot Pro (AJAX Scheduler Control)
» DayPilot AJAX Scheduler
DayPilot » Knowledge Base » How to detect time offset of mouse clicks inside an event

How to detect time offset of mouse clicks inside an event

Last revision: Feb 10, 2010

The current mouse position offset (relative to the event upper-left corner) is stored in dps.eventOffset property.

Example (context menu)

The following code show the relative mouse coordinates after the context menu item is clicked:

<DayPilot:MenuItem Action="JavaScript" JavaScript="alert('x:' + dps.eventOffset.x + ' y:' + dps.eventOffset.y + ' resource:' + e.row());" Text="Mouse offset (relative to event)" />

Calculating the time offset

In order to get the time position that was clicked, you should use a simple calculation involving e.start() as event start position, dps.cellDuration and dps.cellWidth.


var x = dps.eventOffset.x;
var time = e.start().addMinutes(x/dps.cellWidth * dps.cellDuration);

Please note that such a simple calculation only works for continuous timeline (no columns are hidden using ShowNonBusiness="false").

Controls: Scheduler


How to implement Copy & Paste in the Calendar
How to show event details in a modal dialog (modal.js)
How to customize 'Week N' string in the Scheduler header
How to get the scrollbar position as date/time (client side)