Opened 11 years ago

Closed 11 years ago

Last modified 8 years ago

#4309 closed bug (fixed)

Opening multiple modal dialogs causes access problems to inputs

Reported by: boconnor Owned by: Scott González
Priority: blocker Milestone: 1.7.2
Component: ui.dialog Version: 1.7
Keywords: Cc:
Blocked by: Blocking:

Description

A modal dialog (Dialog A) is opened that has an <input> field. Another modal dialog (Dialog B) is opened. Modal Dialog B is closed.

It is now impossible to focus on the <input> field in Modal Dialog A.

Bug exists on all browsers.

Attachments (3)

index.cfm (980 bytes) - added by boconnor 11 years ago.
Simple example of problem
index.html (980 bytes) - added by boconnor 11 years ago.
Simple test case
jquery-ui-dialog.patch (466 bytes) - added by MacAnthony 11 years ago.
patch file for jquery-ui.js version 1.7.1

Download all attachments as: .zip

Change History (13)

Changed 11 years ago by boconnor

Attachment: index.cfm added

Simple example of problem

Changed 11 years ago by boconnor

Attachment: index.html added

Simple test case

comment:1 Changed 11 years ago by MacAnthony

This has something to do with the events being added to modals. If you remove the event list from line ( link to code ) it works. Of course, this also breaks other functionality. I haven't determined if it's related to when they are binded or when they are unbinded. If there are any events in there, this problem persists. I tried removing each individual one. Didn't help.

comment:2 Changed 11 years ago by MacAnthony

Removing the if expression from this code block also makes it so it works:

	destroy: function($el) {
		this.instances.splice($.inArray(this.instances, $el), 1);
        
		if (this.instances.length === 0) {
			$([document, window]).unbind('.dialog-overlay');
		}

		$el.remove();
	}

I think this would break all the overriding event binds from the original dialog box though. It looks like it should unbind all the .dialog-overlay events for the first dialog or previous dialog box if more than 2.

Changed 11 years ago by MacAnthony

Attachment: jquery-ui-dialog.patch added

patch file for jquery-ui.js version 1.7.1

comment:3 Changed 11 years ago by MacAnthony

The patch file I put in there is the current patch file we are going to use to get around this until a better solution becomes available. Hopefully it might help in coming up with a more permanent solution in the core.

comment:4 Changed 11 years ago by Scott González

Milestone: TBD1.8

comment:5 Changed 11 years ago by Scott González

Owner: set to scott.gonzalez
Status: newaccepted

comment:6 Changed 11 years ago by Scott González

Resolution: fixed
Status: acceptedclosed

Fixed in r2431.

comment:7 Changed 11 years ago by rdworth

Milestone: 1.81.7.2

comment:8 Changed 10 years ago by sp

using 1.8rc3, the problem still happens, also for the test-case

comment:10 Changed 10 years ago by Myrlyn

I ran into this problem despite the fixes because I had another element in the page using the ui-dialog class (an older piece of the page was using jqModal, and we updated it to look like ui-dialog by just putting the class on the DIV). As a result, because this element did not have a z-index, when the line of code that checks the z-index was run, the value of z-index was "auto". This causes maxZ to be evaluated as NaN, and causes the problem described above. I was able to fix the problem by ensuring this other element had a numerical z-index.

comment:11 Changed 8 years ago by drakes

I am using slick grid within a dialog. I ran into the following problem only in firefox: I add a contextmenu handler to a cell in a table in a dialog. The contextmenu event is only called when double right clicking. Here is a simplified example: http://jsbin.com/idayod/2/edit

When you only right click once the event is stopped in the mousedown event somewhere around here:

$( document ).bind( $.ui.dialog.overlay.events, function( event ) {
// stop events if the z-index of the target is < the z-index of the overlay
// we cannot return true when we don't want to cancel the event (#3523)
if ( $( event.target ).zIndex() < $.ui.dialog.overlay.maxZ ) {
return false;
}
});

Line ~690 in jquery.ui.dialog.js

EDIT: A possible fix would be to check if the dialog contains the element I think. Something like this:

if ( $( event.target ).zIndex() < $.ui.dialog.overlay.maxZ && !(dialog.element.has(event.target).length ) ) {
return false;
} 
Version 1, edited 8 years ago by drakes (previous) (next) (diff)
Note: See TracTickets for help on using tickets.