Opened 12 years ago
Closed 11 years ago
#7120 closed bug (fixed)
Dialog: Modal operation interrupts drag drop marker functionality on gmaps
Reported by: | dutts | Owned by: | |
---|---|---|---|
Priority: | minor | Milestone: | 1.10.0 |
Component: | ui.dialog | Version: | 1.8.10 |
Keywords: | modal | Cc: | |
Blocked by: | Blocking: |
Description
This was originally discovered while developing on jQuery 1.4.2 but can be reproduced using the latest jQuery.
When embedding a google map in a jQuery dialog, draggable markers cannot be dropped if the dialog is modal. See the following example (ignore the gmaps API error), observe that changing the modal setting to false on the dialog resumes correct behaviour). http://jsbin.com/upofa4/3
I am guessing that in the code which implements dialog modality, mouse events are being intercepted and then only forwarded to the modal window contents, but the mouseUp event isn't being fed through.
Change History (6)
comment:1 Changed 12 years ago by
Keywords: | modal added |
---|
comment:2 Changed 11 years ago by
comment:3 Changed 11 years ago by
Milestone: | 1.9.0 → 1.10.0 |
---|
comment:4 Changed 11 years ago by
Status: | new → open |
---|
I updated the jsbin to use the latest versions and issue is still there http://jsbin.com/upofa4/6/edit
comment:5 Changed 11 years ago by
Summary: | Dialog - Modal operation interrupts drag drop marker functionality on gmaps → Dialog: Modal operation interrupts drag drop marker functionality on gmaps |
---|
comment:6 Changed 11 years ago by
Resolution: | → fixed |
---|---|
Status: | open → closed |
Dialog: Awesome new stacking and overlay implementation. Fixes the following tickets:
Fixes #3534 - Dialog: Modal dialog disables all input elements on page. Fixes #4671 - Dialog: Modal Dialog disables vertical scroll bar in Chrome & Safari. Fixes #4995 - Dialog: Modal Dialog's overlay dissapears in IE when content is tall. Fixes #5388 - Dialog: Don't change z-index when already at the top. Fixes #5466 - Dialog: "modal" Dialog Incorrectly Cancels Input Events. Fixes #5762 - Dialog: Get rid of z-index workaround, document it instead. Fixes #6267 - Dialog: checkboxes that inherit a z-index < jqueryui.dialog z-index don't work. Fixes #7051 - Dialog: modal prevents tab key from moving focus off slider handle. Fixes #7107 - Dialog: Modal dialog event loss with high zindex child elements (FF 3.6). Fixes #7120 - Dialog: Modal operation interrupts drag drop marker functionality on gmaps. Fixes #8172 - Dialog: Change event cancelled when opening modal dialog from another modal dialog. Fixes #8583 - Dialog: Mouse event wrongly stopped. Fixes #8722 - Dialog: Remove stack option. Fixes #8729 - Dialog: Remove zIndex option.
Changeset: 3829a37ca122e923c3a08b964c4b1a946a2a1456
I think this line causes the problem. It captures a bunch of events (focus,mousedown,mouseup,keydown,keypress,click) at the document object and prevents the propagation of those whose target element has a z-index lower than the max overlay z-index. Since google maps uses divs with low z-index values to render its elements (including markers), the mousedown event is not received by the map because the marker usually has a z-index lower than the max overlay z-index. A workaround for this problem is to replace the if statement at line 706 by the following code:
Basically, if the target element is inside a UI widget, consider the z-index of that widget instead of the z-index of the target element. It may not be the desired behaviour for some specific situations but at least it solves the google maps problem. Sorry for the grammar.