Dynamically resize jquery user interface dialog box

Question

I have a jquery dialog. I display gridview asp.net in a dialog box. I want to resize the dialog box depending on the size of the grid.

There is a button that displays a dialog when pressed.

I want to set the size of the dialog so that the gridview fits perfectly into it.

I have my javascript code below : $("#ViewModalPopup").dialog({ height: 800px, scrollable: true, width: 800, modal: true }); 

Here #ViewModalPopup is a div that includes a modal popup.

I tried to implement the following logic to adjust the height of the dialog depending on the size of the div:

 var maxHeight = 600; var currentHeight = $('#ViewModalPopup').height(); if (currentHeight < maxHeight) { var desiredHeight = currentHeight } else { var desiredHeight = maxHeight; } $("#ViewModalPopup").dialog({ height: desiredheight, scrollable: true, width: 800, modal: true }); 

But it does not work like

 var currentHeight = $('#ViewModalPopup').height(); 

exits from zero, starting with the second mouse button.

Can I change the dynamic change of a dialog box?

Answer 1

Set as

  $("#ViewModalPopupDiv1").dialog("option", "maxHeight", 600); 

API