Faça manualmente fazer a caixa de diálogo jQuery, verifique se for necessário redimensionar

Question

Eu tenho uma caixa de diálogo jQuery que carrega seu conteúdo Ajax após a abertura.

Veja isso Jsfiddle (O conteúdo não é carregado com o Ajax, mas adicionado após o Open, o que é suficiente para demonstrar meu problema).

html:

<div id="test">test</div>

JS:

$("#test").dialog({
    minHeight:100,
    maxHeight:200,
    width:300,
    open: function(){
        $(this).html("test<br /><br />test<br />" +
                     "<br />test<br /><br />test" +
                     "<br /><br />test<br /><br />" +
                     "test<br /><br />test<br />" +
                     "<br />test<br /><br />test");
    }
});

Quando é aberto, não permanece fiel ao seu maxHeight até você redimensionar a caixa de diálogo. Existe algum tipo de resize Método que posso ligar depois de adicionar conteúdo à caixa de diálogo?

Prefiro não ter que descobrir manualmente se é necessário redimensionar e quão alto está praticamente embutido no plug -in da interface do usuário.

Answer 1

Jsfiddle exemplo.

Não é exatamente a solução elegante que eu esperava, mas até agora parece funcionar.

Se alguém tiver uma solução melhor, ficarei feliz em ouvi -la.

Answer 2

Coloque o código HTML em uma div real no webapge e use a caixa de diálogo nessa div. Ou para mudar de altura (e outras opções) depois de init ... de JQuery Docs :

//getter
var width = $( ".selector" ).dialog( "option", "height" );
//setter
$( ".selector" ).dialog( "option", "height", 460 );

Answer 3

Definir o máximo na função aberta parece fazer o truque:

$("#test").dialog({
    minHeight:100,
    width:300,
    open: function(){
        $(this).html("test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test<br /><br />test");
        $(this).parent().css("height", "auto");
        $(this).css("maxHeight", 200);
    }
});

EDIT: Aparece quando a div 'teste' é usada como uma caixa de diálogo, fica aninhada no diálogo Div, juntamente com uma div. Como resultado, tanto a div e sua div e sua div precisam ter suas alturas definidas com a div, levando em consideração a altura da divisão do cabeçalho de diálogo. Definir sua altura para o automóvel deve cuidar disso.