Setting Conditional Time Limits for Specific Dates in a Date/Time Field

Would you like to limit the available time options in your Date/Time field for specific dates? By default, the Date/Time field in WPForms allows you to set general time ranges using the form builder settings. However, if you need to enforce special time limits for one particular date (for example, shorter pickup hours on a holiday), you can easily do that using a small JavaScript snippet.

In this tutorial, we’ll walk you through the steps to restrict the available time range for one specific date, while keeping general time limits for all other dates.

Creating the Form

First, you’ll need to create your form and add the Date/Time field.
If you’d like users to select both date and time separately, make sure the field type is set to Date / Time under Format.

For example:

• General pickup time: 11:00 AM to 5:00 PM
• Special day (October 4, 2025): 11:00 AM to 2:00 PM

Adding Conditional Time Limits

Now it’s time to add the snippet to your site.
If you’re not sure where or how to add code snippets, please see our tutorial on adding custom PHP or JavaScript for WPForms.

add_action('wpforms_wp_footer_end',function(){?>
<script type="text/javascript">
jQuery(document).ready(function($){

    var formID=815; // WPForms form ID
    var fieldID=12; // WPForms field ID (Date/Time)

    var dateField=$('#wpforms-'+formID+'-field_'+fieldID);
    var timeField=$('#wpforms-'+formID+'-field_'+fieldID+'-time');
    function updateTimeLimits(){
        var selectedDate=dateField.val();
        if(!selectedDate)return;
        var parts=selectedDate.split('/');
        var day=parseInt(parts[0],10);
        var month=parseInt(parts[1],10);
        var year=parseInt(parts[2],10);
        var minTime='11:00';
        var maxTime='17:00';
        if(month===10&&day===4){maxTime='14:00';}
        var today=new Date();
        var selected=new Date(year,month-1,day);
        if(today.toDateString()===selected.toDateString()){
            var nowH=today.getHours();
            var nowM=today.getMinutes();
            if(nowM>0){nowH++;nowM=0;}
            var currentMin=(nowH<10?'0':'')+nowH+':00';
            if(currentMin>minTime){minTime=currentMin;}
        }
        timeField.timepicker('option',{minTime:minTime,maxTime:maxTime});
    }
    dateField.on('change',updateTimeLimits);
    updateTimeLimits();
});
</script>
<?php},10);

This snippet checks the selected date and adjusts the available times accordingly.
In the example above:

• Every day allows time selection from 11:00 AM to 5:00 PM.
• On October 4, 2025, the range is reduced to 11:00 AM to 2:00 PM.

Make sure to replace:

• 815 with your form ID.
• 12 with your Date/Time field ID

If you’re not sure how to find these, check out our guide on how to locate the form ID and field ID.

And that’s it! You’ve successfully set conditional time limits for a specific date in your WPForms Date/Time field.

Would you like to also block certain date ranges entirely? Check out our tutorial on how to customize the Date/Time field date options.