Available for: Windows 8.1 | Windows Phone 8.1

Bind a DateTime Instance to Calendar SelectedDateRange Property

This article demonstrates how to bind a DateTime instance to calendar property of type CalendarDateRange using the CalendarDateToSingleDateRangeConverter. The converter creates a DateTime object as it takes the SartDate of a CalendarDateRange object, or creates a CalendarDateRange with StartDate and EndDate set to the DateTime object.

The calendar will be used in Single SelectionMode and its SelectedDateRange property will be bound to a DateTime property of the view model.

  1. First, let's create a sample ViewModel class that has a property of type DateTime:

    public class ViewModel : ViewModelBase
        private DateTime date;
        public ViewModel()
            this.Date = DateTime.Today;
        public DateTime Date
                return this.date;
                if (this.date != value)
                    this.date = value;

    Set the DataContext of the Page ot an instance of the ViewModel class:

  2. Then create an instance of the CalendarDateToSingleDateRangeConverter.

        <telerikCalendar:CalendarDateToSingleDateRangeConverter x:Key="converter"/>


  3. Finally, bind the SelectedDateRange to the Date property of the ViewModel using the converter:

    <telerikInput:RadCalendar SelectedDateRange="{Binding Date, Converter={StaticResource converter}, Mode=TwoWay}" SelectionMode="Single"/>