Question

106

Jquery Ui Datepicker month/year dropdown is not working in popup in latest firefox

rated 0 times [ 112] [ 6] / answers: 1 / hits: 22137 / 9 Years ago, mon, april 27, 2015, 12:00:00

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:

http://jsfiddle.net/469zV/2/

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

ashly

Add To Favorites

Follow

Total Points: 601

Total Questions: 95

Total Answers: 88

Location: Saint Vincent and the Grenadines

Member since Thu, Oct 15, 2020

4 Years ago

answered 9 Years ago micayla · Accepted Answer

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