How to Create Advanced Custom EditApointmentDialog

2 posts, 0 answers
  1. Telerik Admin
    Telerik Admin avatar
    1679 posts
    Member since:
    Oct 2004

    Posted 21 Sep 2012 Link to this post

    Requirements

    RadControls version Q2 2012
    .NET version 4.0
    Visual Studio version 2010
    programming language C#
    browser support

    all browsers supported by RadControls


    PROJECT DESCRIPTION
    RadScheduleView is designed to work in such a way that the appointment properties do not notify the UI while the EditAppointmentDialog is opened. Also if the appointment is changed and the edit is canceled, edited properties are not saved.

    The provided project demonstrates how to create a custom ViewModel for your dialog that will allow to update the appointment properties and reflect the changes immediately.

    Here are the basic steps:

    1. Create a new class ( CustomDialogViewModel in our case). There will be kept DependencyProperties of the appointment properties that have to be tracked and updated. In the example project there is a custom property Duration which needs to be changed when Start or End of the appointment is changed:
      public class CustomDialogViewModel : Freezable
      {
          public static readonly DependencyProperty DurationProperty =
              DependencyProperty.Register("Duration", typeof(TimeSpan), typeof(CustomDialogViewModel),
              null);
       
          public static readonly DependencyProperty StartProperty =
              DependencyProperty.Register("Start", typeof(DateTime), typeof(CustomDialogViewModel),
              new PropertyMetadata(OnStartEndChanged));
       
          public static readonly DependencyProperty EndProperty =
              DependencyProperty.Register("End", typeof(DateTime), typeof(CustomDialogViewModel),
              new PropertyMetadata(OnStartEndChanged));
       
       
          public TimeSpan Duration
          {
              get { return (TimeSpan)GetValue(DurationProperty); }
              set { SetValue(DurationProperty, value); }
          }
       
          public DateTime Start
          {
              get { return (DateTime)GetValue(StartProperty); }
              set { SetValue(StartProperty, value); }
          }
       
          public DateTime End
          {
              get { return (DateTime)GetValue(EndProperty); }
              set { SetValue(EndProperty, value); }
          }
       
       
          private static void OnStartEndChanged(DependencyObject s, DependencyPropertyChangedEventArgs e)
          {
              var dvm = s as CustomDialogViewModel;
              dvm.Duration = dvm.End - dvm.Start;
          }
       
          protected override Freezable CreateInstanceCore()
          {
              return new CustomDialogViewModel();
          }
      }
    2. Create an instance of  the newly created CustomAppointmentDialogViewModel into the EditAppointmentTemplate
      <ControlTemplate x:Key="EditAppointmentTemplate" TargetType="local:SchedulerDialog">
          <Grid IsSharedSizeScope="True" x:Name="DialogRoot">
              <Grid.Resources>
                  <example:CustomDialogViewModel
                      Duration="{Binding DataContext.Occurrence.Appointment.Duration, ElementName=DialogRoot, Mode=TwoWay}"
                      Start="{Binding DataContext.ActualStart, ElementName=DialogRoot, Mode=TwoWay}"
                      End="{Binding DataContext.ActualEnd, ElementName=DialogRoot, Mode=TwoWay}"
                      x:Key="CustomDialogViewModel" />
              </Grid.Resources>
          ...
          </Grid>
      </ControlTemplate>
      :
    3. Bind the controls to the CustomDialogViewModel properties, for example
      <TextBlock Grid.Row="4" Grid.Column="1" Margin="3" VerticalAlignment="Center"
                  Text="{Binding Source={StaticResource CustomDialogViewModel}, Path=Duration, Mode=TwoWay}" />
      :
  2. Hiwa
    Hiwa avatar
    21 posts
    Member since:
    Mar 2013

    Posted 29 Apr 2013 Link to this post

    Hi ,
    It was an interesting example
    Thank You
Back to Top