Geek asks and answers

The jQuery dialog shrinks when I open a second time

I have a div (say div1) that contains two drop-down windows and a form that has one other div (say div2). I defined this div1 as a jquery dialog. If you change the first drop down, another drop-down menu will be laid out and when you change the second drop-down list, div2 will be loaded with the result of the html call to ajax.

Now I close the dialog with the close button, and then when I try to open the dialog (div1), the height of the dialog has been reduced below the specified height. If I open a dialog without changing the second drop-down menu, it works fine. Only when onchange occurs in the second drop-down menu does the dialog box become compressed.

JQuery Dialog Open div1:

    $("#fileDoc").dialog({
    bgiframe: true,     
        autoOpen: false,
        height: 680,
        width: 800,
        modal: true,
        resizable: false
});

JQuery dialog close div1:

$('#fileDoc').dialog('close');

jQuery ajax causes the html to load in div2:

$("#doc").html(data);

I am using jQuery 1.4.4 and UI 1.8.2.

+3
source share
2 answers

I found a problem. div2 must be empty before closing the dialog div1, otherwise the height of div2 is also accepted and subtracted with the height of the dialog and therefore reduces the height in jQuery UI Dialog 1.8.2.

so the jQuery dialog close div1:

$("#div2").html(""); $("#fileDoc").dialog("close");
+2
source

When closing, make sure that you destroy the dialog .dialog( "destroy" ), otherwise the dialog and its contents will remain hidden in the DOM. This can create a problem because the identifiers are unique and you can only have one instance of the same #id.

+2
source

More articles:


All Articles