Dialog: find the highest zIndex dialog with overlay to close on ESC k…

…ey. Fixed #5356 - ESC key problem * along the way fixed a related bug with more than one dialog getting closed * added visual test case
jonspalmer · Jul 11, 2010 · 5cae674 · 5cae674 · scottgonzalez · Jul 16, 2010
1 parent 75329fa
commit 5cae674
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 3 deletions.
diff --git a/tests/visual/dialog/dialog_ticket_5365.html b/tests/visual/dialog/dialog_ticket_5365.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8" />
+	<title>Dialog Visual Test : Ticket 5365 - ESC key problem</title>
+	<link rel="stylesheet" href="../visual.css" type="text/css" />
+	<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
+	<script type="text/javascript" src="../../../jquery-1.4.2.js"></script>
+	<script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.1.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
+	<script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
+	<script type="text/javascript">
+	$(function() {
+		var dialogsCount = 0;
+		var openModal = function() {
+			dialogsCount++;
+			$('<div></div>').append('<p> Dialog' + dialogsCount + ' Conent')
+			.dialog({
+				modal: true,
+				buttons: {
+					"Close": function(){$(this).dialog('close');},
+					"OpenNew": openModal
+				}
+			})
+		}
+		openModal();
+	});
+	</script>
+</head>
+<body>
+</body>
+</html>
diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js
@@ -71,6 +71,7 @@ $.widget("ui.dialog", {
 
 						self.close(event);
 						event.preventDefault();
+						event.stopPropagation();
 					}
 				})
 				.attr({
@@ -681,6 +682,7 @@ $.extend($.ui.dialog.overlay, {
 	events: $.map('focus,mousedown,mouseup,keydown,keypress,click'.split(','),
 		function(event) { return event + '.dialog-overlay'; }).join(' '),
 	create: function(dialog) {
+		var self = this;
 		if (this.instances.length === 0) {
 			// prevent use of anchors and inputs
 			// we use a setTimeout in case the overlay is created from an
@@ -694,14 +696,18 @@ $.extend($.ui.dialog.overlay, {
 					});
 				}
 			}, 1);
-
+			
 			// allow closing by pressing the escape key
 			$(document).bind('keydown.dialog-overlay', function(event) {
 				if (dialog.options.closeOnEscape && event.keyCode &&
-					event.keyCode === $.ui.keyCode.ESCAPE) {
+					event.keyCode === $.ui.keyCode.ESCAPE ) {
 
-					dialog.close(event);
+					$.grep(self.instances, function(instance){
+						return instance.zIndex() == $.ui.dialog.overlay.maxZ;
+					})[0].dialog.close(event);
+
 					event.preventDefault();
+					event.stopPropagation();
 				}
 			});
 
@@ -715,6 +721,7 @@ $.extend($.ui.dialog.overlay, {
 				width: this.width(),
 				height: this.height()
 			});
+		$el.dialog = dialog;
 
 		if ($.fn.bgiframe) {
 			$el.bgiframe();