Blackout Dates
RadDateTimePicker allows you to disable certain dates in the calendar part of the control. To do this, set the BlackoutDates property of RadDateTimePicker to a collection of DateTime objects.
RadDateTimePicker control uses RadCalendar to show its calendar. The feature shown in this article is the same as the blackout dates of RadCalendar.
In order for a date from the BlackoutDates collection to get disabled in the calendar, its time portion should be set to the start of the day (usually
00:00:00.00
which is 12:00:00AM). Otherwise, the date won't get reflected in the UI.
Setting BlackoutDates
This section shows how to set the BlackoutDates in code behind.
Example 1: Defining RadDateTimePicker
<telerik:RadDateTimePicker x:Name="radDateTimePicker" />
Example 2: Setting the BlackoutDates property in code behind
public MainWindow()
{
InitializeComponent();
DateTime startDate = DateTime.Today; // note that this will return a date with its hours set to the start of the day (00:00:00). Example: 21.01.2020 00:00:00.00
var blackoutDates = new ObservableCollection<DateTime>()
{
startDate,
startDate.AddDays(1),
startDate.AddDays(2),
startDate.AddDays(3),
};
this.radDateTimePicker.BlackoutDates = blackoutDates;
}
Public Sub New()
InitializeComponent()
Dim startDate As DateTime = DateTime.Today
Dim blackoutDates = New ObservableCollection(Of DateTime)() From {
startDate,
startDate.AddDays(1),
startDate.AddDays(2),
startDate.AddDays(3)
}
Me.radDateTimePicker.BlackoutDates = blackoutDates
End Sub
Data Binding BlackoutDates
This section shows how to data bind the BlackoutDates property.
Example 3: Setting up the model
public class MainViewModel
{
public ObservableCollection<DateTime> BlackoutDates { get; set; }
public MainViewModel()
{
DateTime startDate = DateTime.Today; // note that this will return a date with its hours set to the start of the day (00:00:00). Example: 21.01.2020 00:00:00.00
this.BlackoutDates = new ObservableCollection<DateTime>()
{
startDate,
startDate.AddDays(1),
startDate.AddDays(2),
startDate.AddDays(3),
};
}
}
Public Class MainViewModel
Public Property BlackoutDates As ObservableCollection(Of DateTime)
Public Sub New()
Dim startDate As DateTime = DateTime.Today
Me.BlackoutDates = New ObservableCollection(Of DateTime)() From {
startDate,
startDate.AddDays(1),
startDate.AddDays(2),
startDate.AddDays(3)
}
End Sub
End Class
Example 4: Setting the data context
public MainWindow()
{
InitializeComponent();
this.DataContext = new MainViewModel();
}
Public Sub New()
InitializeComponent()
Me.DataContext = New MainViewModel()
End Sub
Example 5: Data binding the BlackoutDates property
<telerik:RadDateTimePicker BlackoutDates="{Binding BlackoutDates}" />
Find a runnable project that demonstrates how to use BlackoutDates in the online SDK repository.