Dialog does not updates its content's height when its height is changed programmatically
Versions: jQuery 1.3.2 with jQuery UI 1.7.1
Use case: size a dialog's height so that when the browser window is
resized, the dialog resizes to fit vertically on the page.
Problem:
setting the height option and setting the "height.dialog" property
programmatically do not end up having the dialogs _resize method
invoked. As a result the dialog is resized, but the content is not
Code to reproduce (page_help_icon is just a DIV that can be clicked on
to open a help dialog):
$( function()
{
$('#page_help_icon').click( function(event)
{
var $help = $('#page_help');
if ($help.length == 0)
{
var resizeFunc = function (event)
{
$help.dialog('option', 'height', $('body').innerHeight() - 40)
.dialog('option', 'position', 'center');
};
$help = $('<div id="page_help" ></div>').appendTo($('body'))
.dialog({ autoOpen: false, title: 'Help', width: 900,
open: function() { $(window).resize(resizeFunc); },
close: function() { $(window).unbind('resize',
resizeFunc); } });
}
// set content of the help dialog here. Test code:
$help.empty().append($('aoeu<br/>aoeu<br/>aoeu<br/>aoeu<br/>aoeu<br/