Opened 10 years ago

Closed 9 years ago

#4686 closed bug (notabug)

On dragging the UI Dialog box the height of the box changes

Reported by: pks_kaushik Owned by:
Priority: major Milestone: 1.9.0
Component: ui.dialog Version: 1.7.2
Keywords: Cc: pks_kaushik, rnavalakha@…
Blocked by: Blocking:

Description

We are using jquery UI Dialog on IE8 and IE7. Everything goes fine but when we drag the dialog box the height of the dialog box changes from the original height. This difference in height becomes very prominent when the height option is provided to dialog function.

Attachments (1)

quirks.html (3.3 KB) - added by jgentle 10 years ago.

Download all attachments as: .zip

Change History (6)

comment:1 Changed 10 years ago by JamesBarwell

Tested with latest trunk revision (#3337) in IE7 and IE8 on Vista. Launched dialog passing in height as follows: $("#dialog").dialog({ height: 530 });

Could not recreate issue in either browser.

comment:2 Changed 10 years ago by mattlong

I would like to confirm that this is indeed a problem. It *might* only affect dialogs on pages in quirks mode, though I've not thoroughly tested that claim. I'm able to reproduce it using IE8 on Vista in either IE8 quirks mode or IE7 quirks mode.

Changed 10 years ago by jgentle

Attachment: quirks.html added

comment:3 Changed 10 years ago by jgentle

I would like to add some information to this. We have a website that unfortunately we have to keep in quirks mode for the time, but are starting to add some jQuery/jQueryUI. Everything has worked great except when we use IE, then dialog boxes just don't work quite right. After some investigation, I discovered that the _size function in the dialog code sets the height of the contained node to 0 to check the height of the dialog wrapper and subtract it from the requested height. I've found that IE in quirks mode will treat a height of 0 as auto, causing the problem I've been experiencing. I have not been able to find any documentation of this quirk on the internet.

I am attaching a test html page that will demonstrate the error and a possible fix. Each time you click on the open link, it will add a random number to the end of the div. In IE, every time you click on it, the window will get smaller and smaller until it gets too big that it will then become bigger and bigger. I assume this oddity happens because of the min-height setting. Another oddity is if you open a dialog and attempt to drag it, it will attempt to correct the size by making the button area much much larger. Clicking on the fix link will install a modified 1.8a2 _size function that uses a height of 1px to calculate the height of the wrapper, and then compensates for that 1px. After that, the dialog in IE will work as expected.

I apologize that the html is not completely self contained, it does require being pointed at a version of jQueryUI 1.8b2. I currently have it pointed to my local copy at "/static/js/jquery-ui.min.js".

I hope this helps.

comment:4 Changed 9 years ago by roma1123

Cc: pks_kaushik,rnavalakha@cygrp.compks_kaushik, rnavalakha@cygrp.com

Hi Guys,

I have also found this as an issue. Here is a workaround for that, I could not find a better way to fix that in IE6 and IE7+ in QUIRKS Mode: http://extremedev.blogspot.com/2011/03/jquery-dialog-bug-in-ie6-quirks-mode.html

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

Resolution: invalid
Status: newclosed

jQuery and jQuery UI don't support quirks mode.

Note: See TracTickets for help on using tickets.