The JQuery UI datepicker has a behaviour that I consider odd: If you change the month/year but neglect to select a specific date (e.g. if you click away) then the field value does not update to reflect the changes in month and year. This is not specific to ACF, but applies to JQuery UI in general.
This has been noted here, along with some ideas for solutions.
https://stackoverflow.com/questions/10393332/jquery-ui-datepicker-using-onchangemonthyear-to-update-date
These solutions include adding functionality via the “onChangeMonthYear” parameter. See the example, and in this demo: http://jsfiddle.net/ambiguous/JGrVp/.
Can someone advise about how to implement this solution in the context of ACF? Ideally there would be a way to embedded some code in my theme’s functions.php file, rather than changing the plugin directly (to avoid it getting overwritten by updates).
Okay, I found some pointer from zilveer, here:
https://support.advancedcustomfields.com/forums/topic/adding-custom-javascript-to-date-and-time-picker-fields/
and also here:
https://www.advancedcustomfields.com/resources/acf-input-admin_footer/
With this result, that seems to be working!
<?
function my_acf_input_admin_footer() {
?>
<script type="text/javascript">
(function($) {
acf.add_filter('date_picker_args', function( args ){
args['onChangeMonthYear'] = function(y, m, i){
var d = i.selectedDay;
$(this).datepicker('setDate', new Date(y, m-1, d));
}
return args;
});
})(jQuery);
</script>
<?php
}
add_action('acf/input/admin_footer', 'my_acf_input_admin_footer');
?>