Update Events without Reloading

Event Moving and Resizing

If you use EventResizeHandling=Notify and EventMoveHandling=Notify the Calendar will update the events immediately on the client side and the server will be notified after the change. Standard OnEventResize and OnEventMove event will be fired. 

<DayPilot:DayPilotCalendar
  ID="DayPilotCalendar1" 
  runat="server" 
  ...
  EventMoveHandling="Notify" 
  OnEventMove="DayPilotCalendar1_EventMove" 
  EventResizeHandling="Notify"
  OnEventResize="DayPilotCalendar1_EventResize"
  />

Process the event in the code behind.

protected void DayPilotCalendar1_EventMove(object sender, EventMoveEventArgs e)
{
  // update the database here
  DayPilotCalendar1.UpdateWithMessage("Event was moved.");
}

Custom Event Changes

<DayPilot:DayPilotCalendar
  ID="DayPilotCalendar1" 
  runat="server" 
  ...  
  OnNotify="DayPilotCalendar1_Notify" 
  OnEventUpdate="DayPilotCalendar1_EventUpdate"
  OnEventAdd="DayPilotCalendar1_EventAdd" 
  OnEventRemove="DayPilotCalendar1_EventRemove"
  />

You can also submit custom changes done using JavaScript:

var e = dps.events.find('123');
e.text('New Event Name'); // update the event text
dps.events.update(e).notify();

As soon as you call .notify() it will fire EventUpdate event on the server side:

protected void DayPilotCalendar1_EventUpdate(object sender, EventUpdateEventArgs e)
{
  // do the database changes here
}

You can submit multiple changes at once:

var e = dps.events.find('123');
e.text('New Event Name'); // update the event text
dps.events.update(e).queue();

var e = dps.events.find('124');
e.text('New Event Name'); // update the event text
dps.events.update(e).queue();

dps.queue.notify();

All the submitted events are available in e.Queue in OnNotify.

protected void DayPilotCalendar1_Notify(object sender, NotifyEventArgs e)
{
  foreach(DayPilotEventArgs ea in e.Queue)
  {
      if (ea is EventAddEventArgs)
      {
          EventAddEventArgs em = (EventAddEventArgs)ea;
          DayPilotScheduler1_EventAdd(sender, em);

      }
      else if (ea is EventMoveEventArgs)
      {
          EventMoveEventArgs em = (EventMoveEventArgs) ea;
          DayPilotScheduler1_EventMove(sender, em);

      }
      else if (ea is EventRemoveEventArgs)
      {
          EventRemoveEventArgs em = (EventRemoveEventArgs) ea;
          DayPilotScheduler1_EventRemove(sender, em);
      }
      else if (ea is EventUpdateEventArgs)
      {
          DayPilotScheduler1_EventUpdate(sender, (EventUpdateEventArgs) ea);
      }
  }

  string msg = String.Format("Queue saved ({0} actions).", e.Queue.Count);
  DayPilotCalendar1.UpdateWithMessage(msg);
}

Event Moving and Resizing

If you use EventResizeHandling=Notify and EventMoveHandling=Notify the Scheduler will update the events immediately on the client side and the server will be notified after the change. Standard OnEventResize and OnEventMove event will be fired. 

@Html.DayPilotCalendar("dpc", new DayPilotCalendarConfig {
  BackendUrl = ResolveUrl("~/Calendar/Backend"),
  ...
  EventMoveHandling = EventMoveHandlingType.Notify,
  EventResizeHandling = EventResizeHandlingType.Notify
})

Don't call Update() in these event handlers if you don't want to refresh all events.

protected override void OnEventMove(EventMoveArgs e)
{
  new EventManager(Controller).EventMove(e.Id, e.NewStart, e.NewEnd);
  // no Update() or UpdateWithMessage() call
}

Custom Event Changes

You can also submit custom changes done using JavaScript:

var e = dps.events.find('123');
e.text('New Event Name'); // update the event text
dps.events.update(e).notify();

See also:

• http://api.daypilot.org/daypilot-calendar-events-update/

As soon as you call .notify() it will fire OnNotify on the server side:

protected override void OnNotify(NotifyArgs e)
{
  foreach(DayPilotArgs a in e.Queue)
  {
    if (a is EventUpdateArgs)
    {
      EventUpdateArgs updateArgs = (EventUpdateArgs) a;
      string id = updateArgs.Event.Value;
      string newText = updateArgs.New.Text;
      // update the db
    }
  }
}

You can submit multiple changes at once:

var e = dps.events.find('123');
e.text('New Event Name'); // update the event text
dps.events.update(e).queue();

var e = dps.events.find('124');
e.text('New Event Name'); // update the event text
dps.events.update(e).queue();

dps.queue.notify();

All the submitted events are available in e.Queue in OnNotify.