Ticket #5955 (closed bug: fixed)

Opened 4 years ago

Last modified 3 years ago

Dialog: Closing UI dialog when z-index is not defined in any .ui-dialog class, causes NaN to be used as Z-index, throwing an error

Reported by: mlooise Owned by:
Priority: major Milestone: 1.8.7
Component: ui.dialog Version: 1.8.4
Keywords: z-index, dialog Cc:
Blocking: Blocked by:

Description

The error (displayed in IE8) is : Invalid Argument.

This will prevent any future (re-)use of the dialog.

A check will prevent the error. Something like:

jquery-ui-1.8.4.custom.js : line 5885

if (this !== self.uiDialog[0])

{

Get the current z-index of this ui-dialog element curVal = $(this).css('z-index') Only use the current z-index if it is a number. maxZ = Math.max(maxZ, isNaN(curVal) ? maxZ : curVal);

}

Attachments

jquery.ui.dialog.js Download (20.3 KB) - added by mlooise 4 years ago.

Change History

Changed 4 years ago by mlooise

comment:1 follow-ups: ↓ 2 ↓ 6 Changed 4 years ago by scott.gonzalez

In what case do you not have a z-index defined?

comment:2 in reply to: ↑ 1 Changed 4 years ago by mlooise

Replying to scott.gonzalez:

In what case do you not have a z-index defined?

When using the default theme of jquery, downloaded @  http://jqueryui.com/download, jquery-ui-1.8.4.custom.css, i get this problem. The .ui-dialog class needs to have a z-index defined before everything works for me. Looking at the original code, it looks like the author intended to have a default 0 value. This is however comprimised by any NaN values ...

comment:3 follow-up: ↓ 4 Changed 4 years ago by scott.gonzalez

There's a zIndex option which defaults to 1000 which sets the z-index of the dialog on creation.

comment:4 in reply to: ↑ 3 Changed 4 years ago by mlooise

Replying to scott.gonzalez:

There's a zIndex option which defaults to 1000 which sets the z-index of the dialog on creation.

True, However somehow IE8 returns a NaN instead of the default. With this minor change everything works for me. Without it, i get a Invalid Argument exception because an earlier called 'close' set the z-index to NaN. Even if i set the z-index with while creating the dialog.

comment:5 Changed 4 years ago by mlooise

Btw, this only happens with the modal option set to true. I forgot to mention that. It also works fine in Firefox. Firefox seems to handle the NaN problem differently.

Ex:

$('#boolInput').dialog({ buttons: { "No": function() 
				{ 
					$(this).dialog("close"); 
					alert("No");
				
				
				}, "Yes": function() 
				{ 
					$(this).dialog("close"); 
					alert("Yes");
			
				}},
				width: 400,
				height: 400,
				minWidth: 400,
				minHeight: 400,
				modal: true,
				title: 'Confirm',
				autoOpen: false
				
				
				});

// ..

//(Re)-Open the window
$('#boolInput').dialog( "open" );

comment:6 in reply to: ↑ 1 Changed 4 years ago by kevin.wells.iq4bis

Replying to scott.gonzalez:

In what case do you not have a z-index defined?

I discovered some code like this in our application: <div id="my-dialog" class="ui-dialog"></div>. The z-index of this div is auto because $('#my-dialog').dialog() has not been called yet. In this case the problem is solved by simply removing the incorrect class="ui-dialog" attribute.

So in our case this is not a bug in jQuery. However, it seems other people have had this problem (#4652). Perhaps to prevent people having this problem in future this code from jquery.ui.dialog.js:

$('.ui-dialog').each(function() {
  if (this !== self.uiDialog[0]) {
    maxZ = Math.max(maxZ, $(this).css('z-index'));
  }
});

should be changed to ignore auto elements?

$('.ui-dialog').each(function() {
  var zIndex = $(this).css('z-index');
  if (this !== self.uiDialog[0] && zIndex != "auto") {
    maxZ = Math.max(maxZ, zIndex);
  }
});

comment:7 Changed 4 years ago by scott.gonzalez

  • Priority changed from critical to major

comment:8 Changed 3 years ago by jamiejag

I've tried to make a correction to the source. Haven't done this before and there are a lot of hoops to jump through. Hopefully it will take.

 https://github.com/jquery/jquery-ui/pull/43

comment:9 Changed 3 years ago by scott.gonzalez

  • Summary changed from Closing UI dialog when z-index is not defined in any .ui-dialog class, causes NaN to be used as Z-index, throwing an error to Dialog: Closing UI dialog when z-index is not defined in any .ui-dialog class, causes NaN to be used as Z-index, throwing an error

comment:10 Changed 3 years ago by scott.gonzalez

  • Status changed from new to closed
  • Resolution set to fixed
  • Milestone changed from TBD to 1.9

comment:11 Changed 3 years ago by scott.gonzalez

  • Milestone changed from 1.9 to 1.8.7
Note: See TracTickets for help on using tickets.