#4363 closed bug (fixed)
Datepicker Month/Year Dropdowns Not Working In Safari In A Dialog
Reported by: | btburnett3 | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | 1.8 |
Component: | ui.datepicker | Version: | 1.7 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
If you are using month or year change drop downs, and the datepicker is placed inside a dialog, clicking on the drop downs in Safari 3 has no effect. Not sure if it's not displaying the drop down, or if it is somehow hidden due to a z-index issue. In order to get the datepicker to work with dialogs, I set .ui-datepicker {z-index: 10000) in my CSS file.
Attachments (1)
Change History (9)
comment:1 Changed 14 years ago by
comment:2 Changed 14 years ago by
It isn't related to that, I've already corrected this by applying a z-index to my datepicker to bring it to the foreground.
I tracked down the problem, it is related to the overlay of a modal dialog box. The overlay traps all bubbled mouse events and cancels them if they are not from a child of the dialog. Since the datepicker's DIV is outside the dialog, all events are cancelled. This doesn't affect any of the controls normally. However, the SELECT control is paying attention to this cancel in Safari only.
I worked around it temporarily on my site by adding an additional filter to the overlay event in the ui.dialog.js file, but this isn't a very elegant solution to the problem.
comment:3 Changed 14 years ago by
Milestone: | TBD → 1.8 |
---|
comment:4 Changed 13 years ago by
I have also reproduced this issue while testing one of my applications. This occurs in webkit browsers only (Safari and Chrome).
comment:5 Changed 13 years ago by
FYI, I made the following change to work around this issue at approximately line 537 in ui.dialog.js (1.7.1): from:
0; |
to:
0; |
This solution is not ideal though. I wish you could just check on the zIndex of event.target, but that doesn't seem to work, probably because zIndex only applies to absolutely positioned elements.
comment:9 Changed 11 years ago by
I believe this issue 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 sometimes works in IE9. Firefox 3.6 has no issues and have not tested on a later version of Firefox. Based on a web search others appear to be having this issue as well:
Is this possibly related to ticket #4338, "DatePicker shown under Dialog box", which was marked as don't fix?