Opened 11 years ago

Closed 11 years ago

#4053 closed bug (notabug)

The dialog not always appears in the center/bottom vertically. Workaround supplied.

Reported by: MindStorm Owned by:
Priority: minor Milestone: 1.6rc6
Component: ui.dialog Version: 1.6rc6
Keywords: dialog center Cc:
Blocked by: Blocking:

Description

I have the following code

$.ui.dialog.defaults.bgiframe = true;

$(document).ready(function(){
	$("#dialog-box").dialog({
		width: 700,
		autoOpen: false,
		modal: true,
		position: ['center','middle']
	});
});

function show_dialog(params)
{
	$("#dialog-box").load(
		"http://examle.com"
		{ params: params},
		function() {
			$("#dialog-box").dialog("open");
		});
}

When the funcion show_dialog is called many times and the heigth of the content (obtained from ajax) is variable, p.e. content have images in different heights: the dialog appears a little below of the middle or a little below of the bottom of the visible page, surpassing the limits of the window. Tested on Firefox 3.0.5 and Internet Explorer 7.

I can't figure out the cause of this behavior yet. Maybe an ajax related issue or the sizing/positioning calculations is missing someting.

But a temporal workaround to avoid this behavior is to use the setTimeOut() function when open the dialog:

setTimeout(function(){ $("#sociales-dialogo").dialog("open"); }, 100);

The ideal situation is avoiding the setTimeOut, but setting it at 100 - 150 milliseconds will be imperceptible in the meanwhile. I hope that this bug is fixed in the next realease.

I will try to upload an example about this bug later.

Change History (4)

comment:1 Changed 11 years ago by MindStorm

I chose the improper component. I chose ui.core instead of ui.dialog. Sorry for the mistake.

comment:2 Changed 11 years ago by MindStorm

I found what's causing bad positioning. When the content has images with various heights and are loaded for first time, it causes a miscalculation because the image is not completely loaded yet.

I fixed the problem by adding the heights and width of the images (with CSS or with the attributes of img tag). You no longer need to use setTimeout.

comment:3 Changed 11 years ago by rdworth

Milestone: 1.71.8

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

Component: ui.coreui.dialog
Milestone: 1.81.6rc6
Resolution: invalid
Status: newclosed

As noted by the reporter, the dialog is positioned properly and the size of the content changes after it has been shown.

Note: See TracTickets for help on using tickets.