ACF Date Time Picker – set end date to after start date

With two related Date Time Picker fields limit the end date to be after the start date.

Mid 2020 I wrote about setting the end date to be after the start date in an ACF Date Picker field. In a comment Max asked how to apply the same restriction to a Date Time Picker field.

Jump Start

In last year’s post I read a lot of ACF documentation and did a number of experiments with the ACF JavaScript API. This time around I was able to skip all that and jump straight to tweaking the original code and experimenting with Date Time Picker fields.

I got lucky that it mostly just worked. I did change the field wrapper class from ‘start-dp-wrapper‘ to ‘start-dtp-wrapper‘ to avoid a clash with my Date Picker code. The Date Time Picker field uses the datetimepicker() function so it may not work correctly with a Date Picker field (and vice versa).

Copying the date and time

While the field’s ‘setDate‘ function does copy both the date and time, the field does not have a setting to limit the minimum time. This makes sense as it is valid to change the end date (to one later than start date) and have an earlier time.

The developer will have to add code to ensure that the end date and time are later than the start date and time. My code takes care of the date part.

The code