Skip to main content

Search and Top Navigation

#8088 closed bug (worksforme)

Opened February 01, 2012 04:52PM UTC

Closed February 02, 2012 01:18PM UTC

Last modified December 28, 2012 03:10PM UTC

Datepicker Month/Year Dropdowns Not Working In Safari In A Dialog (#4363 has returned)

Reported by: reefruner5 Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.datepicker Version: 1.8.17
Keywords: Cc:
Blocked by: Blocking:

I believe the issue identified in #4363 has returned.

We are using a JQGrid with a datepicker in the add\\edit modal dialog. Clicking on the month or year column has no effect in Chrome, and rarely works in IE9. In this case not working indicates that clicking on the dropdown has no affect in setting the value and the dropdown simple disappears.

Firefox 3.6 has no issues and I have not tested on a later version of Firefox. Based on a web search others appear to be having this issue as well:

Version Info:

jQuery UI Datepicker 1.8.17

jQuery JavaScript Library v1.7.1

OS: Win7

Browsers Affected:


Chrome 16

Attachments (0)
Change History (5)

Changed February 02, 2012 01:18PM UTC by scottgonzalez comment:1

resolution: → worksforme
status: newclosed

Changed February 02, 2012 01:52PM UTC by reefruner5 comment:2

Can you please try to reproduce using a jqgrid with a modal dialog instead of just a modal dialog. The reproduction here does not fully cover the scenario we are having issues with.

Changed February 02, 2012 02:22PM UTC by scottgonzalez comment:3

Can you try to reproduce without using a massive plugin?

Changed February 02, 2012 03:37PM UTC by reefruner5 comment:4

I copied your example into our codebase and like you saw there are no issues. It only becomes an issue when we overlay this with the JQGrid and use it in the add\\edit modal dialog.

Changed December 28, 2012 03:10PM UTC by nibedita comment:5

Hi All

It only becomes an issue when we overlay this with the JQGrid and use it in the add\\edit modal dialog.

The bug is occurred due to focus change .When we click the month or year drop down the focus set to first element of add/edit dialogue in jQGrid.

So we have to change the jquery-ui .js file and jquery.js file (according to your version).

declare boolean doNotProcessEvenet =false


f.event = {

add: function (a, c, d, e) {

if (a.nodeType !== 3 && a.nodeType !== 8) {

if (d === !1) d = D;

else if (!d) return;

var g, h;

d.handler && (g = d, d = g.handler), d.guid || (d.guid = f.guid++);

var i = f._data(a);

if (!i) return;

var j =,

k = i.handle;

j || ( = j = {}), k || (i.handle = k = function (a) {

/* check if the variable is true then return*/

if (doNotProcessEvenet == true){



return typeof f != "undefined" && (!a || f.event.triggered !== a.type) ? f.event.handle.apply(k.elem, arguments) : b

}), k.elem = a, c = c.split(" ");


<select class="ui-datepicker-month" onmouseover="doNotProcessEvenet=true;" onmouseout="doNotProcessEvenet=false;" onchange="DP_jQuery_'+y+".datepicker._selectMonthYear('#""', this, 'M');doNotProcessEvenet=false;\\" onclick=\\"DP_jQuery_"+y+".datepicker._clickMonthYear('#"+"'