Restrict Time Selection Based on the Day of the Week

If you're using a Date and Time Picker field in RSForm!Pro and want to limit users from selecting a time earlier than 11:00 AM, based on the weekday selected, you can achieve this with a bit of JavaScript.

For example, your schedule looks similar to:

• Monday: 11:00 AM – 4:30 PM
• Tuesday: 11:00 AM – 6:00 PM
• Wednesday: 11:00 AM – 7:00 PM
• Thursday: 11:00 AM – 8:00 PM
• Friday: 11:00 AM – 5:00 PM
• Saturday: 11:00 AM – 4:00 PM
• Sunday: 1:00 PM – 4:00 PM

To apply these restrictions in your form, place the following code in Form Properties > CSS and Javascript > JavaScript:

<script type="text/javascript">

jQuery(document).ready(function(){
    // Change this to your own form ID
    var formId = 1;
    // Change this to your own Date and Time Picker field 'Name' property
    var fieldName = 'DateTimePickerField';

    var myDatePicker = RSFormPro.jQueryCalendar.calendars[formId][fieldName];
    myDatePicker.callbackSelectedDateTime = function(selectedDateObject, instance, calendarDateObject, input, inputFormat) {
        var allowTimes = [];
        var weekDay = calendarDateObject.getDay();

        switch (weekDay)
        {
            // Sunday
            case 0:
            allowTimes = ['13:00', '14:00', '15:00', '16:00']
            break;

            // Monday
            case 1:
            allowTimes = ['11:00', '12:00', '13:00', '14:00', '15:00', '16:00']
            break;

            // Tuesday
            case 2:            
            allowTimes = ['11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00']
            break;

      // Wednesday
            case 3:
            allowTimes = ['11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00']
            break;

      // Thursday
            case 4:
            allowTimes = ['11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00']
            break;

            // Friday
            case 5:            
            allowTimes = ['11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00']
            break;

      // Saturday
            case 6:
            allowTimes = ['11:00', '12:00', '13:00', '14:00', '15:00', '16:00']
            break;
        }

        this.calendarInstance.setOptions({
            allowTimes: allowTimes,
        });
    }
});
</script>

Make sure to replace formId = 1 with your actual Form ID, fieldName = 'DateTimePickerField' with the Name of your Date & Time Picker field.

This code dynamically adjusts available time slots after a user picks a date.