When user selects time first, the date gets defaulted to today's date

5 posts, 1 answers
  1. Chloe
    Chloe avatar
    7 posts
    Member since:
    Feb 2019

    Posted 12 Feb Link to this post

    Whenever the user selects the time before the date on the RadDateTimePicker DropDown, the date gets defaulted to today's date (even though today's date is outside of the specified selectabledates). I'm looking for a way to default the date to SelectableDateStart or have the RadDateTimePicker wait for the user to select a date.

     

    I included two pictures:

    1. What the user sees when he clicks on the DepartureDateTime RadDateTimePicker

    2. What gets selected when the user clicks on the time first (and hasn't selected any dates)

     

    My XAML code looks like this:

    <telerik:RadDateTimePicker x:Name="ItineraryDepartureDateTimePicker"
    SelectedValue="{Binding Itinerary.DepartureTime}"
    SelectableDateStart="{Binding Itinerary.TravelRequestFromDate}"
    SelectableDateEnd="{Binding Itinerary.TravelRequestToDate
    IsInputRestrictedToSelectableDates="True"

    DisplayDate="{Binding Request.FromDate}"
    DisplayDateStart="{Binding Itinerary.TravelRequestFromDate}"
    DisplayDateEnd="{Binding Itinerary.TravelRequestToDate}"

    CalendarStyle="{StaticResource CalendarStyle}" HorizontalAlignment="Left" DateTimeWatermarkContent="{DynamicResource LocalTime}" Width="140"/>

     

    Where:

    • Itinerary.DepartureTime is of type DateTime and is currently null
    • Itinerary.TravelRequestFromDate is of type DateTime and is currently "July 25, 2018 00:00:00"
    • Itinerary.TravelRequestToDate is of type DateTime and is currently "July 27, 2018 00:00:00"

    What am I missing? Why is the date being defaulted to today's date whenever the user selects a time before a date on the Dropdown?

     

  2. Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    908 posts

    Posted 15 Feb Link to this post

    Hello Chloe,

    The behavior you observe is expected and is by design as once a selection is made on either the date or time part of the picker, the following code is executed:

    var current = this.CurrentDateTime; // if ths.SelectedValue is null, this returns DateTime.Today
     
    var date = this.SelectedDate.HasValue ? this.SelectedDate.Value : current;
    var time = this.SelectedTime.HasValue ? this.SelectedTime.Value : current.TimeOfDay;
     
    var calendar = (this.GetCultureToUse() as CultureInfo).DateTimeFormat.Calendar;
    var year = calendar.GetYear(date);
    var month = calendar.GetMonth(date);
    var day = calendar.GetDayOfMonth(date);
     
    this.SetCurrentValue(SelectedValueProperty, new DateTime(year, month, day, time.Hours, time.Minutes, time.Seconds, time.Milliseconds, calendar));

    You can observe that if the SelectedDate is null, the current date will be used.

    To achieve the desired result, you can handle the SelectionChanged event of the control in the following manner:

    private void RadDateTimePicker_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        var picker = sender as RadDateTimePicker;
        var newDate = e.AddedItems[0] as DateTime?;
        var isValidDate = picker.SelectableDateStart <= newDate && newDate <= picker.SelectableDateEnd;
        if (!isValidDate)
        {
            if (newDate < picker.SelectableDateStart)
            {
                var year = picker.SelectableDateStart.Value.Year;
                var month = picker.SelectableDateStart.Value.Month;
                var day = picker.SelectableDateStart.Value.Day;
                var hour = newDate.Value.Hour;
                var minute = newDate.Value.Minute;
                var second = newDate.Value.Second;
                picker.SelectedValue = new DateTime(year, month, day, hour, minute, second);
            }
            else if (newDate > picker.SelectableDateEnd)
            {
                var year = picker.SelectableDateEnd.Value.Year;
                var month = picker.SelectableDateEnd.Value.Month;
                var day = picker.SelectableDateEnd.Value.Day;
                var hour = newDate.Value.Hour;
                var minute = newDate.Value.Minute;
                var second = newDate.Value.Second;
                picker.SelectedValue = new DateTime(year, month, day, hour, minute, second);
            }
        }
    }

    Please let me know whether such an approach would work for you.

    Regards,
    Dilyan Traykov
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Chloe
    Chloe avatar
    7 posts
    Member since:
    Feb 2019

    Posted 15 Feb in reply to Dilyan Traykov Link to this post

    The problem now is when the user first get to the RadDateTimePicker, the textbox is not null anymore, it already has a date selected. I still want my radDateTimePicker to be null at first until the user click on the calendar dropdown for the first time.

    How can I do that?

    Thank you,

  4. Answer
    Dilyan Traykov
    Admin
    Dilyan Traykov avatar
    908 posts

    Posted 15 Feb Link to this post

    Hello Chloe,

    I've prepared a small sample project where the SelectedValue is not populated initially using this approach.

    Could you please have a look and let me know how this setup differs from the one at your end? If possible, please describe the action steps required to observe this undesired behavior.

    I look forward to your reply.

    Regards,
    Dilyan Traykov
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  5. Chloe
    Chloe avatar
    7 posts
    Member since:
    Feb 2019

    Posted 20 Feb Link to this post

    Thank you for your help.

    Works perfectly.

Back to Top