This is a migrated thread and some comments may be shown as answers.

Date/Time Picker set enabled time range for different days

3 Answers 866 Views
Calendar, DateTimePicker, TimePicker and Clock
This is a migrated thread and some comments may be shown as answers.
Ian
Top achievements
Rank 1
Ian asked on 02 Oct 2018, 12:26 PM

Hi Telerik

I am using the RadDateTimePicker to allow the user to select a date and a time.

I have successfully set the MinDate and MaxDate to limite the user to a date range and I also set the MinTime and MaxTime to limit the user to an allowable timeslot.

We now require the user to be restricted to different time slots on different days i.e. Monday to Friday 09:00 - 17:00, Saturday 10:00 - 14:00 and Sunday 12:00 - 13:00 to reflect different opening hours of a shop.

When setting the MinTime and MaxTime i use the following code:

var rdtpc = this.rdtp_TargetDate.DateTimePickerElement.CurrentBehavior as RadDateTimePickerCalendar;
rdtpc.ShowTimePicker = true;
rdtpc.TimePicker.TimePickerElement.MinValue = DateTime.Today.Date.AddHours(9);
rdtpc.TimePicker.TimePickerElement.MaxValue = DateTime.Today.Date.AddHours(17);

 

This is fine for a single time range, but what event do I need to wire up to allow me to set different enabled time range for different days/dates?

Thanks

 

 

3 Answers, 1 is accepted

Sort by
0
Hristo
Telerik team
answered on 03 Oct 2018, 11:37 AM
Hi Ian,

You can restrict the available hours, by handling the ValueChanged event of the control. In the event handler, you can validate the selected value according to the day of the week and set different working hours. In order to update the element with the new min and max values, it will be also necessary to call its PrepareContent method: 
public partial class RadForm1 : Telerik.WinControls.UI.RadForm
{
    public RadForm1()
    {
        InitializeComponent();
 
        var rdtpc = this.radDateTimePicker1.DateTimePickerElement.CurrentBehavior as RadDateTimePickerCalendar;
        rdtpc.ShowTimePicker = true;
        rdtpc.TimePicker.Culture = new System.Globalization.CultureInfo("DE-de");
 
        rdtpc.TimePicker.TimePickerElement.InvalidateChildrenOnChildChanged = true;
        this.radDateTimePicker1.ValueChanged += RadDateTimePicker1_ValueChanged;
    }
 
    private void RadDateTimePicker1_ValueChanged(object sender, EventArgs e)
    {
        var rdtpc = this.radDateTimePicker1.DateTimePickerElement.CurrentBehavior as RadDateTimePickerCalendar;
        DayOfWeek dayOfWeek = this.radDateTimePicker1.Value.Date.DayOfWeek;
        switch (dayOfWeek)
        {  
            case DayOfWeek.Sunday:
                rdtpc.TimePicker.TimePickerElement.MinValue = DateTime.Today.Date.AddHours(12);
                rdtpc.TimePicker.TimePickerElement.MaxValue = DateTime.Today.Date.AddHours(13);
                break;
            case DayOfWeek.Monday:
            case DayOfWeek.Tuesday:
            case DayOfWeek.Wednesday:
            case DayOfWeek.Thursday:
            case DayOfWeek.Friday:
                rdtpc.TimePicker.TimePickerElement.MinValue = DateTime.Today.Date.AddHours(9);
                rdtpc.TimePicker.TimePickerElement.MaxValue = DateTime.Today.Date.AddHours(17);
                break;
            case DayOfWeek.Saturday:
                rdtpc.TimePicker.TimePickerElement.MinValue = DateTime.Today.Date.AddHours(10);
                rdtpc.TimePicker.TimePickerElement.MaxValue = DateTime.Today.Date.AddHours(14);
                break;
        }
         
        rdtpc.TimePicker.TimePickerElement.PrepareContent();
    }
}

I am also attaching a short video showing the result on my end.

Regards,
Hristo
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.
0
Ian
Top achievements
Rank 1
answered on 03 Oct 2018, 12:06 PM

Hi Hristo

Many thanks for the quick response.

I had all the code already but was just missing this line.

rdtpc.TimePicker.TimePickerElement.PrepareContent();

All fixed and working now.

Many thanks

Ian

0
Hristo
Telerik team
answered on 03 Oct 2018, 12:49 PM
Hi Ian,

Than you for writing back. I am glad that the suggested approach is working well in your actual project.

Let me know if you have other questions.

Regards,
Hristo
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.
Tags
Calendar, DateTimePicker, TimePicker and Clock
Asked by
Ian
Top achievements
Rank 1
Answers by
Hristo
Telerik team
Ian
Top achievements
Rank 1
Share this question
or