#3539 closed bug (duplicate)

Opened November 03, 2008 08:58PM UTC

Closed June 09, 2011 06:40PM UTC

Last modified October 03, 2012 04:48PM UTC

Stacked dialogs can be closed even when not in front

Reported by: BrianHV Owned by: scottgonzalez
Priority: minor Milestone: 1.6
Component: ui.dialog Version: 1.6rc2
Keywords: Cc:
Blocked by: Blocking:
Description

The escape key can be used to close a modal dialog even when it's not in the front of the stacking order. Tested in IE7 with trunk.

<html>
    <body>
        <script type="text/javascript" language="javascript" src="jquery-1.2.6.js"></script>
        <script type="text/javascript" language="javascript" src="ui/ui.core.js"></script>
        <script type="text/javascript" language="javascript" src="ui/ui.dialog.js"></script>
        <div id="firstDialog"><h1>First Dialog</h1><a href="#" onclick="$('#secondDialog').dialog('open')">Now click this link</a></div>
        <div id="secondDialog"><h1>Second Dialog</h1><p>Now click the text "First Dialog" and then press escape.  The first dialog will close, leaving the second dialog stranded.</div>
        <p><a href="#" onclick="$('#firstDialog').dialog('open');">Click this link</a></p>
        <script type="text/javascript" language="javascript">
            $(document).ready(function(){
                $('#firstDialog').dialog({modal: true, width: 400, height: 400, overlay: { opacity: 0.5, background: 'black' }, autoOpen: false}).css('background', 'white');
                $('#secondDialog').dialog({modal: true, width: 200, height: 200, overlay: { opacity: 0.5, background: 'black' }, autoOpen: false}).css('background', 'white');
            });
        </script>
    </body>
</html>
Attachments (0)
Change History (8)

Changed December 31, 2008 08:37PM UTC by scottgonzalez comment:1

milestone: TBD → 1.next

Changed May 11, 2009 12:41PM UTC by jzaefferer comment:2

The dialog itself binds keydown event to itself for closing the dialog on ESC; in addition, the dialog overlay binds a keydown event to document, without filtering to close only the active dialog.

Instead of creating an overlay for each modal dialog, there should be just one overlay below the active dialog and above all others. Pressing ESC would then close the top dialog and move the overlay below the next dialog, or hide it if there is none.

Changed March 28, 2011 07:24PM UTC by j4r3d comment:3

status: new → open

Created a test case here: http://jsbin.com/ejomo4/2/edit

Changed May 17, 2011 08:19PM UTC by davidmurdoch comment:4

fixed in: https://github.com/jquery/jquery-ui/pull/303

Changed June 04, 2011 01:00AM UTC by scottgonzalez comment:5

#7445 is a duplicate of this ticket.

Changed June 09, 2011 06:40PM UTC by scottgonzalez comment:6

resolution: → duplicate
status: open → closed

Changed June 09, 2011 06:40PM UTC by scottgonzalez comment:7

Duplicate of #6966.

Changed October 03, 2012 04:48PM UTC by scottgonzalez comment:8

milestone: 1.next → 1.6