DayPilot.Scheduler.onTimeRangeSelected

The onTimeRangeSelected event is fired when a user selects a date/time range using drag and drop in the JavaScript Scheduler component.

This event is fired after the default action specified using timeRangeSelectedHandling property. See also onTimeRangeSelect, which is fired before the default action.

There is also onTimeRangeSelecting event which is fired when the drag and drop selecting is in progress (whenever the selection changes).

Declaration

DayPilot.Scheduler.onTimeRangeSelected(args)

Parameters

• args.start - start of the selection (DayPilot.Date object)

• args.end - end of the selection (DayPilot.Date object)

• args.multirange - an array of selections (if multi-range selection is enabled); each item has start, end, and resource properties

• args.origin ("click" | "drag" | "api" | "keyboard") - origin of the event; "click" is used if the users clicks a grid cell without dragging; available since 2023.4.5803

• args.resource - ID of the selection resource (string or number)

Example

// event creating, api2
dp.onTimeRangeSelected = function (args) {
  var name = prompt("New event name:", "Event");
  dp.clearSelection();
  if (!name) return;
  var e = new DayPilot.Event({
      start: args.start,
      end: args.end,
      id: DayPilot.guid(),
      resource: args.resource,
      text: "Event"
  });
  dp.events.add(e);
  dp.message("Created");
};

See Also

• onTimeRangeSelect

• timeRangeSelectedHandling

api=1

See also DayPilot.Scheduler.api.

Declaration

onTimeRangeSelected(start, end, resource)

Parameters

• start (DayPilot.Date) - start of the selected range

• end (DayPilot.Date) - end of the selected range

• resource (string) - id of the resource

Example

// event creating, api1
dp.onTimeRangeSelected = function (start, end, resource) {
  var name = prompt("New event name:", "Event");
  dp.clearSelection();
  if (!name) return;
  var e = new DayPilot.Event({
      start: start,
      end: end,
      id: DayPilot.guid(),
      resource: resource,
      text: "Event"
  });
  dp.events.add(e);
  dp.message("Created");
};