[Solved] Date selection is flaky when using DayTemplateSelector

[David]

I'm using the RadCalendar control, and I'm getting flaky behavior after assigning a DayTemplateSelector. The logic is working correctly, however sometimes the calendar cannot select any dates (even the ones that still show as "selectable"). The problem goes away if I advance the calendar by one month using the arrow controls on it, then go back. After going forward and then back one month, the dates become selectable. I'm not doing anything else special with the calendar control aside from assigning the DayTemplateSelector. Is this a bug?

XAML:

<telerik:RadCalendar x:Name="calSchedule" Grid.Row="0" Grid.Column="3" Grid.RowSpan="5" Margin="12 2 2 2" Height="160" VerticalAlignment="Top" SelectionMode="Multiple">
                 <telerik:RadCalendar.DayTemplateSelector>
                     <!--Custom Template selector, sill actually choose just one template-->
                     <local:DayMaskSelector>
                         <local:DayMaskSelector.DefaultTemplate>
                             <!--A custom template-->
                             <DataTemplate>
                                 <TextBlock Text="{Binding Text}" />
                             </DataTemplate>
                         </local:DayMaskSelector.DefaultTemplate>
                     </local:DayMaskSelector>
                 </telerik:RadCalendar.DayTemplateSelector>
             </telerik:RadCalendar>

Code-behind:

public void SetCalendarDaysOfWeek(int dayOfWeekMask)
{
    DayMaskSelector existingSelector = calSchedule.DayTemplateSelector as DayMaskSelector;
    if (existingSelector != null && existingSelector.DayMask == dayOfWeekMask)
    {
        // Matches current mask; don't change it.
        return;
    }
    calSchedule.DayTemplateSelector = new DayMaskSelector(dayOfWeekMask);
}

Selector class:

public class DayMaskSelector : DataTemplateSelector
 {
     const int SundayValue = 1;
     const int MondayValue = 2;
     const int TuesdayValue = 4;
     const int WednesdayValue = 8;
     const int ThursdayValue = 16;
     const int FridayValue = 32;
     const int SaturdayValue = 64;

    private int _dayMask;

    public int DayMask
     {
         get
         {
             return _dayMask;
         }
     }

    public DayMaskSelector()
         : base()
     {
     }

    public DayMaskSelector(int dayMask)
         : base()
     {
         _dayMask = dayMask;
     }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)
     {
         CalendarButtonContent content = item as CalendarButtonContent;
         if (content != null)
         {
             content.IsEnabled = true;
             if (_dayMask > 0)
             {
                 if (content.Date.DayOfWeek == DayOfWeek.Sunday && ((_dayMask & SundayValue) == 0))
                 {
                     content.IsEnabled = false;
                 }
                 if (content.Date.DayOfWeek == DayOfWeek.Monday && ((_dayMask & MondayValue) == 0))
                 {
                     content.IsEnabled = false;
                 }
                 if (content.Date.DayOfWeek == DayOfWeek.Tuesday && ((_dayMask & TuesdayValue) == 0))
                 {
                     content.IsEnabled = false;
                 }
                 if (content.Date.DayOfWeek == DayOfWeek.Wednesday && ((_dayMask & WednesdayValue) == 0))
                 {
                     content.IsEnabled = false;
                 }
                 if (content.Date.DayOfWeek == DayOfWeek.Thursday && ((_dayMask & ThursdayValue) == 0))
                 {
                     content.IsEnabled = false;
                 }
                 if (content.Date.DayOfWeek == DayOfWeek.Friday && ((_dayMask & FridayValue) == 0))
                 {
                     content.IsEnabled = false;
                 }
                 if (content.Date.DayOfWeek == DayOfWeek.Saturday && ((_dayMask & SaturdayValue) == 0))
                 {
                     content.IsEnabled = false;
                 }
             }
         }
         return DefaultTemplate;
     }

    private DataTemplate defaultTemplate;
     public DataTemplate DefaultTemplate
     {
         get
         {
             return defaultTemplate;
         }
         set
         {
             this.defaultTemplate = value;
         }
     }
 }

[Ivo]

Hi David,

I just tried to reproduce what you describe, using the code you provided, without any success. If I understand what you described, this doesn't happen all the time. It would be great if you can isolate it and find out exactly when this happens, so we will be able to investigate it further.

Greetings,
Ivo
the Telerik team

[David]

I was able to resolve the issue by first setting the property to null, then to the new value. This seems like a bug. Here is the code that works:

public void SetCalendarDaysOfWeek(int dayOfWeekMask)
{
    DayMaskSelector existingSelector = calSchedule.DayTemplateSelector as DayMaskSelector;
    if (existingSelector != null && existingSelector.DayMask == dayOfWeekMask)
    {
        // Matches current mask; don't change it.
        return;
    }

    // NOTE: Setting this value first to NULL and then to the new selector
    // appears to be a workaround for a bug in the Calendar control.
    // The bug causes dates to sometimes be unselectable.
    calSchedule.DayTemplateSelector = null;
    calSchedule.DayTemplateSelector = new DayMaskSelector(dayOfWeekMask);
}

[Ivo]

Hi David,

We tried to reproduce this using the sample code provided and this time we got the behavior you described. I've logged this as a bug in our PITS. You can track its status here, so once it is fixed you can remove the workaround as well.

I am glad to update your telerik points. Excuse us for the inconvenience caused.

All the best,
Ivo
the Telerik team