Somehow my jQuery UI Datepicker Month/Year Dropdown not working in any popup in latest firefox .
When I click on Month or Year Dropdown, the options list doesn't appears.
Here is my Popup & Datepicker Code:
$( "#dialog-form" ).dialog({
modal: true
});
$("#datepicker").datepicker({
changeMonth: true,
changeYear: true
});
I prepared a demo on JSfiddle too:
This is because the modal enforces focus on itself. Here is a solution for this as mentioned here . Add the below script to your js file. That's it.
jsfiddle: http://jsfiddle.net/surjithctly/93eTU/16/
Ref: Twitter bootstrap multiple modal error
// Since confModal is essentially a nested modal it's enforceFocus method
// must be no-op'd or the following error results
// "Uncaught RangeError: Maximum call stack size exceeded"
// But then when the nested modal is hidden we reset modal.enforceFocus
var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus;
$.fn.modal.Constructor.prototype.enforceFocus = function() {};
$confModal.on('hidden', function() {
$.fn.modal.Constructor.prototype.enforceFocus = enforceModalFocusFn;
});
$confModal.modal({ backdrop : false });
For Bootstrap 4:
replace : $.fn.modal.Constructor.prototype.enforceFocus
By: $.fn.modal.Constructor.prototype._enforceFocus