title: Changing the size of a jquery UI dialog dynamically
body: <p>I have a jquery dialog . I am displaying an asp.net gridview within the dialog.
  I want the size of the dialog to change based on the size of the grid view.</p>
  
  <p>There is a button, which shows the dialog when its clicked.</p>
  
  <p>I want to set the size of the dialog such that the gridview fits in it perfectly.</p>
  
  <pre><code>   I have my javascript code below : 
  
  
  
   $("#ViewModalPopup").dialog({
                  height: 800px,
                  scrollable: true,
                  width: 800,
                  modal: true
  
              });
  </code></pre>
  
  <p>Here #ViewModalPopup is the div that encloses the modal popup.</p>
  
  <p>I tried implementing the following logic to adjust the height of the dialog based on the size of the div :</p>
  
  <pre><code>var maxHeight = 600;
              var currentHeight = $('#ViewModalPopup').height();
  
  if (currentHeight &lt; maxHeight) {
                  var desiredHeight = currentHeight
                  }
              else
              {
                  var desiredHeight = maxHeight;
                  }
  
    $("#ViewModalPopup").dialog({
                      height: desiredheight,
                      scrollable: true,
                      width: 800,
                      modal: true
  
                  });
  </code></pre>
  
  <p>But it is not working as </p>
  
  <pre><code>var currentHeight = $('#ViewModalPopup').height();
  </code></pre>
  
  <p>is coming out to be null from the second button click onwards.</p>
  
  <p>Is there any way I can change the size of the dialog dynamically ?</p>