Events
DayPilotCalendar can handle both single- and double-click events:
- EventClick
- EventDoubleClick
- EventRightClick
Double Clicks
Double clicks are detected automatically: no EventClick event will be fired if the second click happens within 300 ms:
- You can use both EventClick and EventDoubleClick event handlers at the same time.
- Each of these events can perform a different action, e.g. inline editing on double click, opening event bubble on single click.
JavaScript
The JavaScript version uses api2 by default.
Possible handling types (eventClickHandling):
- 'Enabled' (default)
- 'Disabled'
- 'Edit'
- 'Select'
- 'ContextMenu'
- 'Bubble'
dp.onEventClicked = function(args) { alert("clicked: " + args.e.id()); };
ASP.NET WebForms
You can assign an action to event click using EventClickHandling property.
- 'Disabled' (default)
- 'CallBack' (fires the server-side event handler using CallBack)
- 'PostBack' (fires the server-side event handler using PostBack)
- 'JavaScript' (custom JS code)
- 'Edit' (enters inline editing mode)
- 'Select' (selects the event, fires EventSelect event depending on EventSelectHandling value)
- 'ContextMenu' (shows a context menu for this event, see also event context menu)
- 'Bubble' (shows a bubble for this event, see also event bubble)
.aspx
<DayPilot:DayPilotCalendar ID="DayPilotCalendar1" runat="server" EventClickHandling="JavaScript" EventClickJavaScript="eventClick(e);" ... DataTagFields="status" ... /> <script type="text/javascript"> function eventClick(e) { // only fire the server-side event if the ID is 5 or status field is set to tentative if (e.value() == "5" || e.tag("status") == "tentative") { dpc.eventClickCallBack(e); } } </script>
.aspx.cs
function eventClick(e) { // only fire the server-side event if the ID is 5 or status field is set to tentative if (e.value() == "5" || e.tag("status") == "tentative") { dpc.eventClickCallBack(e); } }
ASP.NET MVC
You can assign an action to event click using EventClickHandling property.
- 'Disabled' (default)
- 'CallBack' (fires the server-side event handler using CallBack)
- 'JavaScript' (custom JS code)
- 'Edit' (enters inline editing mode)
- 'Select' (selects the event, fires EventSelect event depending on EventSelectHandling value)
- 'ContextMenu' (shows a context menu for this event, see also event context menu)
- 'Bubble' (shows a bubble for this event, see also event bubble)
@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig { BackendUrl = ResolveUrl("~/Calendar/Backend"), EventClickHandling = EventClickHandlingType.JavaScript, EventClickJavaScript = "editEvent(e.value());", ... })