Skip to main content

Search and Top Navigation

#1876 closed enhancement (fixed)

Opened November 01, 2007 02:29AM UTC

Closed December 08, 2007 03:46PM UTC

Last modified February 26, 2009 11:15AM UTC

ui.dialog.js - Dialog Positioning Improvement

Reported by: ALLPRO Owned by: rdworth
Priority: minor Milestone: 1.5
Component: ui.core Version: 1.2.1
Keywords: dialog Cc:
Blocked by: Blocking:

The current code for positioning a dialog window does not work if the dialog source DIV is 'hidden', which is likely to be a common way of using the dialog component. (I put my dialogs inside a hidden container div.) The problem is that you cannot 'measure' a div that is not displayed. This prevents the proper positioning of the dialog, such as 'center'.

There is a very simple solution - set...

display: block; visibility: hidden

...before measuring width and height. This allows dimensions to be taken without making the DIV visible.

Here is the modified 'open' code - only the first and last lines are new... = function() {
  uiDialog.appendTo('body')'''.css({ visibility: 'hidden' })'''.show();
  var wnd = $(window), top = 0, left = 0;
  switch (options.position) {
    case 'center':
      top = (wnd.height() / 2) - (uiDialog.height() / 2);
      left = (wnd.width() / 2) - (uiDialog.width() / 2);
    case 'left':
      top = (wnd.height() / 2) - (uiDialog.height() / 2);
      left = 0;
    case 'top':
      top = 0;
      left = (wnd.width() / 2) - (uiDialog.width() / 2);
  uiDialog.css({ top: top, left: left, visibility: 'visible'  });
Attachments (0)
Change History (5)

Changed November 01, 2007 02:36AM UTC by ALLPRO comment:1

NOTE: There is a typo in the code line above. I tried to bold a block of 'code', but it added the "' formatting code for bolding to the string instead. The first line should read:

uiDialog.appendTo('body').css({ visibility: 'hidden' }).show();

Changed November 19, 2007 02:03PM UTC by paul comment:2

owner: → rworth

Changed December 08, 2007 03:46PM UTC by rdworth comment:3

resolution: → fixed
status: newclosed

This seems to be working as of [4079]. Added a test to for regressions.

Changed May 24, 2008 03:39AM UTC by comment:4

milestone: 1.2.2

Milestone 1.2.2 deleted

Changed February 26, 2009 11:15AM UTC by paul comment:5

milestone: → 1.5