Dialog: Modal dialog event loss with high zindex child elements (FF 3.6)

I could not reproduce in FF 3.6.17 or FF 4.0.1 with latest (1.9pre).

I have Replicated this.

Firefox 6.0.2.

This is how I have it setup 9 links on a 'results' page. When a user clicks the result 'block' (thumbnail) an non-invasive script launches an ajax call and puts those results into an ajax modal-dialog and opens its.

(pardon the bad coding was trying to debug the problem before I realized it was a browser issue)

#!div style="font-size: 90%"
Here's the relevant parts of my code:
  {{{#!js



jQuery(document).ready(function($) {



jQuery('.results a.diagThis').each(function(){
	jQuery(this).click(function(){
		var target_html="<div class='diagTarget'></div>";
		var diag_options={
			dialogClass: 'customClass',
			modal: true,
			draggable:false,
			resizable:false,
			autoOpen: false,
			minHeight: 547,
			width: 900,
			maxHeight: 650,
			maxWidth: 900
		};

		// ...

		var $_this=this;
		jQuery.ajax({
			context: jQuery($_this),
			type: 'POST',
			url: ajaxurl, 
			data: ajax_data, 
			success: function(response){
				jQuery('.diagTarget').html(jQuery(response).find('response object response_data').text());//WORDPRESS XML
			}
		});
	});
});



});

  

}}}

When the user 'clicks' any thumbnail after the first one; none of the links (or any clickable for that matter) will not work within the content area (selector '.ui-dialog-content.ui-widget-content') but you can use the close button within the title bar!

The issue specifically resides with the modal being set to true. I wasn't able to pin-point it in the source code but I was able to discover a simple work around (I don't think this will work if you are animating but try it :)).

#!div style="font-size: 90%"
A work around I used is to change my options from:
  {{{#!js

		var diag_options={
			dialogClass: 'customClass',
			modal: true,
			// ...
			maxHeight: 650,
			maxWidth: 900
		};
  

}}}

#!div style="font-size: 90%"
To This:
  {{{#!js

		var diag_options={
			beforeClose: function(){
				jQuery('.diagTarget').dialog( "option" , 'modal' ,false );
			},
			dialogClass: 'customClass',
			modal: true,
			// ...
			width: 900,
			maxHeight: 650,
			maxWidth: 900
		};
  

}}}

I added to the event handler 'beforeClose' to remove the 'modal' option setting it to false.

This is jQuery UI 1.8.6, but I verified the issue was also contained within 1.8.16.

Using jQuery 1.4.4

Sadly this isn't my site and I wasn't able to track down the issue in the UI source code :(

I suspect related to Bug 4800.

I believe it is related to this bug because of this line 267-278 in jquery ui dialog (ver 1.8.16):

		if (self.options.modal) {
			maxZ = 0;
			// ...
			$.ui.dialog.maxZ = maxZ;
		}

I suspect the above as the troublesome lines as the issue seems to be between closing properly and being in modal mode?

Please attach your complete, working test case as we are having trouble recreating your issue.

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