Datepicker (month and year) not working inside fancybox

Question

I am having a problem with my fancybox 3 and jquery ui datepicker. if I place the datepicker outside the fancybox.. the dropdown for months and years are working.. but when I place it inside fancybox. the dropdown is not being triggered. any idea what is happening?

$("#Date_To").datepicker({changeMonth: true,changeYear: true});

image

Answer 1

I tried using modal and found a solution. is there any way I can covert this code for fancybox?

var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus;

$.fn.modal.Constructor.prototype.enforceFocus = function() {};

$confModal.on('hidden', function() { $.fn.modal.Constructor.prototype.enfor

Answer 2

Try disabling focusing, something like this:

$('[data-fancybox]').fancybox({
    autoFocus : false,
    trapFocus : false,
    touch     : false,
    beforeClose : function() {
        $( ".selector" ).datepicker( "hide" );
    }
});

Demo - https://codepen.io/fancyapps/pen/QqLXaz